Components
Charts
Setting UpArea ChartLine ChartBar ChartPie ChartRadar ChartRadial Bar ChartScatter ChartTooltip ChartColors
Color AreaColor FieldColor PickerColor SliderColor SwatchColor Swatch PickerColor ThumbColor WheelDrag and drop
Drop ZoneForms
CheckboxCheckbox GroupFieldFormInput OTPNumber FieldRadio GroupSearch FieldTag FieldText FieldTextareaUtilities
Visually HiddenComponents
Heading
Heading is a component used to display titles and subtitles, providing a clear structure and emphasis for organizing and presenting content.
Basic
This is a standard heading.
Preview
Code
The quick brown fox jumps over the lazy dog
Installation
If you hit any issues, make sure you check out the installation guide here for more information.
Anatomy
Manual Installation
Heading Levels
By default, when a heading is used on a card component, it will default to level 3. Titles range from levels 1 to 4. Each level determines the title type and font size.
Preview
Code
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Letter Spacing
Use the tracking prop to adjust letter spacing. Defaults to normal.
Preview
Code