Bootstrap 6 component CSS

Author a component's styles and markup — the non-JavaScript pieces. Bootstrap 6 components are built from a Sass map of CSS custom properties (the token map), a base class that emits those tokens, and modifier classes that override them.

For interactive behavior, see the bootstrap-component-js skill. For palettes, theme colors, and color modes, see the bootstrap-color-system skill.

Workflow

• Step 1: Plan the component
• Step 2: Create the partial and token map
• Step 3: Write the base class
• Step 4: Add modifiers, variants, and sizes
• Step 5: Wire up theme colors
• Step 6: Markup and accessibility
• Step 7: Register the partial
• Step 8: Document the component
• Step 9: Verify