Storybook
-
Theme
-
Light
-
Dark
-
System
-
Light tone
-
Light
-
Light high contrast
-
Light colorblind
-
Light Tritanopia
-
Dark tone
-
Dark
-
Dark dimmed
-
Dark high contrast
-
Dark colorblind
-
Dark Tritanopia
-
Reset to default
- Introduction
-
Components
- Action list
- Action menu
- Alert
- Avatar
- Blankslate
- Box
- Branch name
- Breadcrumb
- Button
- Button group
- Checkbox
- Checkbox group
- Circle badge
- Counter
- Dialog
- Drawer
- Dropdown
- Ellipsis
- Filter list
- Header
- Input validation message
- Label
- Layout
- Link
- Menu
- Octicon
- Pagination
- Progress
- Radio button
- Radio group
- Radio tabs
- Select
- Select menu
- Side nav
- Spinner
- State label
- Styled HTML
- Subhead
- Subnav
- Tabnav
- Text input
- Textarea
- Theme
- Theme menu
- Theme menu options
- Timeline
- Toggle switch
- Truncate
- Underline nav
- Scoped
Theme
Creates a wrapper that sets the light/dark color mode and theme, with support for color blindness.
-
Documentation
- theme
Default (system settings)
Label
Danger
12
12
Light
Label
Danger
12
12
Light high contrast
Label
Danger
12
12
Light colorblind
Label
Danger
12
12
Light Tritanopia
Label
Danger
12
12
Dark
Label
Danger
12
12
Dark dimmed
Label
Danger
12
12
Dark high contrast
Label
Danger
12
12
Dark colorblind
Label
Danger
12
12
Dark Tritanopia
Label
Danger
12
12
Inline
Setting a theme on individual items using attr
is_inline.
HTML attributes
Setting a theme on individual items using
PrimerLive.Theme.html_attributes.