Color

Usage

There are two color groups:

  • Theme colors: these are the brand colors of the application or website
  • Feedback colors: these colors are used to style notifications, form feedback messages and code blocks

Resources

Coming Soon!

playbook

Base colors

color:light
color:dark

Theme colors

primary
primary:000
primary:100
primary:200
primary:300
primary:400
primary:500
primary:600
accent
accent:000
accent:100
accent:200
accent:300
accent:400
accent:500
accent:600
highlight
highlight:000
highlight:100
highlight:200
highlight:300
highlight:400
highlight:500
highlight:600

Semantic colors

info
info:000
info:100
info:200
info:300
info:400
info:500
info:600
success
success:000
success:100
success:200
success:300
success:400
success:500
success:600
warning
warning:000
warning:100
warning:200
warning:300
warning:400
warning:500
warning:600
error
error:000
error:100
error:200
error:300
error:400
error:500
error:600

Cookies

🍪 This website uses cookies 🍪

These cookies allow me to save your preferences on the site (including your cookie preferences). There is no personal data stored in these cookies.

This cookie allows me to measure the performance of the site as well as viewership. The data used are: referer, browser, device, location (country), date, and page views.