Back to Style Guide

Buttons

Button components in multiple variants and sizes using FindborgUI classes.

Button Sizes

Size Comparison

button-sm
button-md (default)
button-lg
Note: The base .button class defaults to medium size (40px). Add -sm or -lg modifiers for different sizes.

Primary Buttons

Classes: button button-primary button-sm | button-md | button-lg

Secondary Buttons

Classes: button button-secondary button-md

Outline Buttons

Classes: button button-outline button-md

Ghost Buttons

Classes: button button-ghost button-md

Text Buttons

Classes: button button-text button-md

Icon Buttons

Classes: fui-icon-btn fui-icon-btn--md fui-icon-btn--primary

States

Disabled State

Note: Disabled buttons have 50% opacity and cursor: not-allowed