Skip to content

← Examples · bullframe.min.css

Typography

Headings, lead copy, inline styles, lists, quotes, and tables. Default type scale with bf-responsive-typography on the body.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Body and lead

Lead paragraphs use .bf-lead and sit larger than body text.

Body copy uses a normal measure. Links like Get started keep the default focus ring and contrast.

Small print for captions, legal lines, and secondary notes.

Inline styles

You can use strong, emphasis, highlight, inline code, Ctrl+K, CSS, and links without utility classes.

Lists

  • Unordered item
  • Second item with a nested list
    • Nested one
    • Nested two
  • Third item
  1. Install the package
  2. Pick a build file
  3. Write semantic HTML

Blockquote

One stylesheet for reset, type, forms, and layout.

Code sample

npm install bullframe.css
/* then import dist/css/bullframe.css */

Figure

Harbor illustration used as a sample figure
Figure caption under an image.

Type scale table

Element Role Notes
h1–h6 Section titles Native heading cascade
.bf-lead Intro copy About 120% of body size
small Secondary text Captions and fine print
code / kbd Technical UI Monospace defaults