---
url: https://bullframecss.marcopontili.com/components.md
---
# Components

Copy-paste HTML patterns built with Bullframe's existing classes. No JavaScript, no extra CSS, no dependencies; just markup.

These pages complement the [Buttons](../buttons) reference (and the rest of Core Concepts). Use these when you need a complete pattern: a login form, a header nav, a card grid.

## Available patterns

* **[Button Patterns](./button-patterns)** - groups, icon buttons, full-width, segmented controls.
* **[Forms](./forms)** - login, contact, search, inline forms.
* **[Modals](./modals)** - native `<dialog>` with no JavaScript.
* **[Cards](./cards)** - content, media, pricing.
* **[Navigation](./navigation)** - header nav, breadcrumb, pagination.

## Conventions

Every snippet on these pages:

* Uses only Bullframe classes (`.bf-*`) and standard HTML.
* Works in the default `bullframe.css` build (and the other shipped variants unless noted).
* Is keyboard-accessible and meets WCAG AA contrast.
* Has zero JavaScript unless the pattern fundamentally requires it (e.g. dialog open/close, where one-line JS is shown).

If a pattern doesn't fit your case, treat it as a starting point. Bullframe's classes are composable.