Components

Button

Make your call-to-action clear with primary and secondary buttons. Use the primary for the main action and the secondary for less important actions.

Dark ButtonLight Button
Card

Cards are visually contained blocks of content used to segment and organize information. Their uniform style enhances scannability and layout flexibility.

Content Card

Card Title

Description

Button
Feature Card

Card Title

Description

Icons

Icons are visual representations of actions, objects, or ideas. Use them to make the interface more intuitive and easy to use. Choose icons that are familiar to your users and have clear meanings.

Dark ButtonLight Button
Text Input

Text inputs allow users to enter text or numbers. Use them for forms or searches.

Default
Label
Helper text
Active
Label
|
Text Link

Text links allow users to navigate to additional content. Links allow easy movement between pages, enhancing usability and findability.

Text link darkText link light
Tabs

Tabs are a great way to organize content and make it easier for users to navigate. Use tabs to group related content and keep the page visually organized.

Dark ButtonLight Button
Home←Logos →