Button

Variants

Background and foreground variant

In case a button needs to follow the background/foreground color, "background" or "foreground"can be passed to variant prop. On light color scheme, background will automatically refer to the light color variant and foreground to the dark color variant. Same goes for the dark color scheme.

CTA Button

It is common for CTA (call-to-action) buttons to have a bit more of an oomph to get users more likely to click on them. This is can achieved by making the button more eye-catching.

Disabled

Size

With icon

The code editor in this site comes with heroicons in the global scope. You can access them via HeroIconsSolid.IconName. For the full list of icons, visit heroicons site.