Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:
The Spectrum CSS color palette is a collection of named colors that are used throughout the design system. These colors are defined in the @spectrum-css/tokens package and are available as CSS custom properties. To preview the resolved colors in different color contexts, use the global color switcher in the toolbar above.
25
50
75
100
200
300
400
500
600
700
800
900
1000
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
100
200
300
400
500
600
700
800
900
1000
1100
1200
1300
1400
1500
1600
25
50
75
100
200
300
400
500
600
700
800
900
1000
25
50
75
100
200
300
400
500
600
700
800
900
1000
| Property | Value |
|---|---|
--spectrum-accent-color-100 | rgb(245, 249, 255) |
--spectrum-accent-color-200 | rgb(229, 240, 254) |
--spectrum-accent-color-300 | rgb(203, 226, 254) |
--spectrum-accent-color-400 | rgb(172, 207, 253) |
--spectrum-accent-color-500 | rgb(142, 185, 252) |
--spectrum-accent-color-600 | rgb(114, 158, 253) |
--spectrum-accent-color-700 | rgb(93, 137, 255) |
--spectrum-accent-color-800 | rgb(75, 117, 255) |
--spectrum-accent-color-900 | rgb(59, 99, 251) |
--spectrum-accent-color-1000 | rgb(39, 77, 234) |
--spectrum-accent-color-1100 | rgb(29, 62, 207) |
--spectrum-accent-color-1200 | rgb(21, 50, 173) |
--spectrum-accent-color-1300 | rgb(16, 40, 140) |
--spectrum-accent-color-1400 | rgb(12, 31, 105) |
--spectrum-accent-color-1500 | rgb(14, 24, 67) |
--spectrum-accent-color-1600 | rgb(7, 11, 30) |
--spectrum-drop-shadow-color-100 | rgba(0, 0, 0, 0.12) |
--spectrum-drop-shadow-color-200 | rgba(0, 0, 0, 0.16) |
--spectrum-drop-shadow-color-300 | rgba(0, 0, 0, 0.2) |
--spectrum-informative-color-100 | rgb(245, 249, 255) |
--spectrum-informative-color-200 | rgb(229, 240, 254) |
--spectrum-informative-color-300 | rgb(203, 226, 254) |
--spectrum-informative-color-400 | rgb(172, 207, 253) |
--spectrum-informative-color-500 | rgb(142, 185, 252) |
--spectrum-informative-color-600 | rgb(114, 158, 253) |
--spectrum-informative-color-700 | rgb(93, 137, 255) |
--spectrum-informative-color-800 | rgb(75, 117, 255) |
--spectrum-informative-color-900 | rgb(59, 99, 251) |
--spectrum-informative-color-1000 | rgb(39, 77, 234) |
--spectrum-informative-color-1100 | rgb(29, 62, 207) |
--spectrum-informative-color-1200 | rgb(21, 50, 173) |
--spectrum-informative-color-1300 | rgb(16, 40, 140) |
--spectrum-informative-color-1400 | rgb(12, 31, 105) |
--spectrum-informative-color-1500 | rgb(14, 24, 67) |
--spectrum-informative-color-1600 | rgb(7, 11, 30) |
--spectrum-negative-color-100 | rgb(255, 246, 245) |
--spectrum-negative-color-200 | rgb(255, 235, 232) |
--spectrum-negative-color-300 | rgb(255, 214, 209) |
--spectrum-negative-color-400 | rgb(255, 188, 180) |
--spectrum-negative-color-500 | rgb(255, 157, 145) |
--spectrum-negative-color-600 | rgb(255, 118, 101) |
--spectrum-negative-color-700 | rgb(255, 81, 61) |
--spectrum-negative-color-800 | rgb(240, 56, 35) |
--spectrum-negative-color-900 | rgb(215, 50, 32) |
--spectrum-negative-color-1000 | rgb(183, 40, 24) |
--spectrum-negative-color-1100 | rgb(156, 33, 19) |
--spectrum-negative-color-1200 | rgb(129, 27, 14) |
--spectrum-negative-color-1300 | rgb(104, 21, 10) |
--spectrum-negative-color-1400 | rgb(80, 16, 6) |
--spectrum-negative-color-1500 | rgb(59, 11, 4) |
--spectrum-negative-color-1600 | rgb(29, 5, 2) |
--spectrum-notice-color-100 | rgb(255, 246, 231) |
--spectrum-notice-color-200 | rgb(255, 236, 207) |
--spectrum-notice-color-300 | rgb(255, 218, 158) |
--spectrum-notice-color-400 | rgb(255, 193, 94) |
--spectrum-notice-color-500 | rgb(255, 162, 19) |
--spectrum-notice-color-600 | rgb(252, 125, 0) |
--spectrum-notice-color-700 | rgb(232, 106, 0) |
--spectrum-notice-color-800 | rgb(212, 91, 0) |
--spectrum-notice-color-900 | rgb(194, 78, 0) |
--spectrum-notice-color-1000 | rgb(167, 62, 0) |
--spectrum-notice-color-1100 | rgb(144, 51, 0) |
--spectrum-notice-color-1200 | rgb(118, 41, 0) |
--spectrum-notice-color-1300 | rgb(95, 32, 0) |
--spectrum-notice-color-1400 | rgb(73, 24, 0) |
--spectrum-notice-color-1500 | rgb(52, 18, 0) |
--spectrum-notice-color-1600 | rgb(25, 8, 0) |
--spectrum-positive-color-100 | rgb(237, 252, 241) |
--spectrum-positive-color-200 | rgb(215, 247, 225) |
--spectrum-positive-color-300 | rgb(173, 238, 197) |
--spectrum-positive-color-400 | rgb(107, 227, 162) |
--spectrum-positive-color-500 | rgb(43, 209, 125) |
--spectrum-positive-color-600 | rgb(18, 184, 103) |
--spectrum-positive-color-700 | rgb(11, 164, 93) |
--spectrum-positive-color-800 | rgb(7, 147, 85) |
--spectrum-positive-color-900 | rgb(5, 131, 78) |
--spectrum-positive-color-1000 | rgb(3, 110, 69) |
--spectrum-positive-color-1100 | rgb(2, 93, 60) |
--spectrum-positive-color-1200 | rgb(1, 76, 52) |
--spectrum-positive-color-1300 | rgb(0, 61, 44) |
--spectrum-positive-color-1400 | rgb(0, 46, 34) |
--spectrum-positive-color-1500 | rgb(0, 33, 25) |
--spectrum-positive-color-1600 | rgb(0, 15, 12) |