Typography

Documentation and examples for typography, including global settings, headings, body text, lists, and more.

Global settings

Startkit sets basic global display, typography, and link styles. When more control is needed, check out the assets/scss/base/_typography.scss file.

Headings

All HTML headings, <h1> through <h6>, are available.

Heading Example
<h1></h1>

h1. Heading
<h2></h2>

h2. Heading
<h3></h3>

h3. Heading
<h4></h4>

h4. Heading
<h5></h5>
h5. Heading
<h6></h6>
h6. Heading

Buttons

Documentation and examples for buttons, including global settings, variants and colors.

Button types

Solid Button DONATE NOW DONATE NOW DONATE NOW DONATE NOW DONATE NOW DONATE NOW DONATE NOW 
                        
                        get_partial('components/button', [
                            'class' => 'btn--solid',
                            'href' => '#',
                            'buttonText' => 'Solid Button'
                        ]);
                        get_partial('components/button', [
                            'class' => 'btn--solid btn--primary',
                            'href' => '#',
                            'buttonText' => 'DONATE NOW'
                        ]);
                        get_partial('components/button', [
                            'class' => 'btn--outline',
                            'href' => '#',
                            'buttonText' => 'DONATE NOW'
                        ]);

                        get_partial('components/button', [
                            'type' => 'button',
                            'buttonText' => 'Type button'
                        ]);