Components

Bundled preset button classes for fast, consistent actions.

Overview

Components are reusable interface patterns built on top of the lower-level utility classes. Instead of assembling every state from scratch, you reach for a component pattern when you want a familiar piece of UI to behave consistently across a site.

Common component categories include buttons for actions, badges for short status labels, and links for navigation or secondary calls to action. Utilities still matter here because they handle the layout, spacing, and typography around each component.

At the moment, the bundled component documentation focuses on the preset button classes that ship with the plugin. Badges and links are still typically composed with the utility system rather than documented as separate shipped presets.

Button

Pre-styled action buttons with semantic colors and separate size classes

What Ships

• Colors: .button-primary, .button-secondary, .button-neutral, .button-success, .button-warning, .button-error
• Sizes (combine with a color class): .button-xs, .button-sm, .button-md, .button-lg, .button-xl

Use utility classes on top when you need layout, spacing, or typography adjustments around the preset.

Related Utilities

Colors

Color utilities that pair cleanly with button presets

Spacing

Margin and padding helpers around calls to action