skip to main content
skip to navigation sidebar
skip to context sidebar
A next-generation tool to create blazing-fast documentation sites
API
Blog
Tutorial
Showcase
twitter
github
Edit this page
created:12/30/2020
updated:12/30/2020
loc
84
comments
12%

CanvasColor

avatar of atanasster

Color item displaying as a row, with color, name, sass variable name and hex value Design inspired by Canvas Design System.

A11y tests

Primary
SORBET
#ff8f59
$color-sorbet
Shade
SORBET_DARK
#e68250
$color-sorbet-dark
Medium Tint
SORBET_MEDIUM
#ffc7ac
$color-sorbet-medium
Light Tint
SORBET_LIGHT
#fff3ee
$color-sorbet-light

Viewport

Primary
SORBET
#ff8f59
$color-sorbet
Shade
SORBET_DARK
#e68250
$color-sorbet-dark
Medium Tint
SORBET_MEDIUM
#ffc7ac
$color-sorbet-medium
Light Tint
SORBET_LIGHT
#fff3ee
$color-sorbet-light
320px
Primary
SORBET
#ff8f59
$color-sorbet
Shade
SORBET_DARK
#e68250
$color-sorbet-dark
Medium Tint
SORBET_MEDIUM
#ffc7ac
$color-sorbet-medium
Light Tint
SORBET_LIGHT
#fff3ee
$color-sorbet-light
375px
Primary
SORBET
#ff8f59
$color-sorbet
Shade
SORBET_DARK
#e68250
$color-sorbet-dark
Medium Tint
SORBET_MEDIUM
#ffc7ac
$color-sorbet-medium
Light Tint
SORBET_LIGHT
#fff3ee
$color-sorbet-light
768px
Primary
SORBET
#ff8f59
$color-sorbet
Shade
SORBET_DARK
#e68250
$color-sorbet-dark
Medium Tint
SORBET_MEDIUM
#ffc7ac
$color-sorbet-medium
Light Tint
SORBET_LIGHT
#fff3ee
$color-sorbet-light
1024px
Previous
Design Tokens/Colors/BoltColor
Next
Design Tokens/Colors/CedarColor