Buttons

Versatile button components with multiple variants, sizes, and modifiers.

Variants

Thrynd provides 4 button variants for different use cases:

Variant	Usage
`btn-primary`	Main call-to-action, most important action on page
`btn-secondary`	Secondary actions, less prominent
`btn-danger`	Destructive actions like delete, remove
`btn-ghost`	Minimal style for tertiary actions

Buttons come in three sizes: small, medium (default), and large.

Add btn-outline for a bordered button style:

Use btn-block or w-full utility for full-width buttons:

Add btn-loading to indicate a loading state:

Use the disabled attribute to disable a button:

You can combine multiple modifiers for custom button styles:

Best Practices: