HHS Styleguide
← Back to site

Buttons & CTAs

All variants use the base-cta base class from global.css composed with an appearance class and a size class. Rendered via the LinkButton React component.

Appearances · Medium size

PrimarySecondaryTertiarySubmitDisabledDestructive

Sizes

xsmall Button
small Button
medium Button
large Button
xsmall Button
small Button
medium Button
large Button
xsmall Button
small Button
medium Button
large Button

Sizes with Icons

Accepts any Lucide icon name as a string prop. Icons can be added to the left or right of the label, or both.

xsmall Button
small Button
medium Button
large Button
xsmall Button
small Button
medium Button
large Button
xsmall Button
small Button
medium Button
large Button

Raw HTML classes

Direct CSS class composition without the LinkButton component

Primary Secondary Tertiary

With external link icon

newTab=true renders an ExternalLink icon via LinkButton

Full width

Block-level CTA