Getting Started
Dark Mode
Charts
Colors
Drag-and-drop
Forms
Utilities
Colors
The Justd color system is designed to provide a consistent and accessible color palette across your application. It includes a range of colors, including primary, secondary, accent, and muted colors.
Colors
The Justd color system is crafted to ensure a consistent and accessible color palette throughout your application. It features a diverse range of colors, including primary, secondary, accent, and muted shades.
This is the default theme in Justd. You can personalize it by customizing settings on the themes page.
Color Usage
The table below shows the color classes used in the Justd components and their corresponding components.
| Background Class | Used in Components |
|---|---|
| primary | pagination, slider, radio, date-field, tag-group, drop-zone, switch, calendar, grid-list, range-calendar, progress-bar, badge, number-field, sidebar, table, toggle, command-menu, checkbox |
| accent | list-box, dropdown, command-menu |
| overlay | popover, chart, sheet, drawer, tooltip, modal, command-menu |
| secondary | note, list-box, pagination, choicebox, calendar, range-calendar, dialog, progress-bar, badge, number-field, sidebar, table, button, toggle, command-menu, toast |
| muted | navbar, card, slider, radio, meter, color-slider, switch, dropdown, badge, color-wheel, checkbox, color-area |
| warning | tag-group |
| success | note, tag-group |
Change Gray
When you install Justd using the CLI, you'll be prompted to select your preferred gray scale. Options include Tailwind's default grays such as gray, slate, zinc, stone, and neutral. If needed, you can always visit the themes page to change your selection.
Or by running the following command:
Learn more about the CLI in the CLI documentation.