This repository contains Storybook brand assets. Feel free to use and customize these assets for your articles, talks, addons, websites, and anything else you can think of.
- Logo
- Icon
- Badge
- Fonts
- Colors
- Presentation template
- Illustrations
- Video
| Default | Inverse |
|---|---|
 |
 (white text) |
| Default | Inverse | Monochrome |
|---|---|---|
 |
 (white icon) |
 |
Share that your project uses Storybook by adding our badge to your readme or website.
<a href="https://github.com/storybooks/storybook" target="_blank"><img src="https://raw.githubusercontent.com/storybooks/brand/master/badge/badge-storybook.svg"></a>
Storybook uses these fonts on the website and promotional materials.
| Font | Weights | Link |
|---|---|---|
| Nunito Sans | 400 (normal), 600 (bold), 900 (black) | Google fonts, Local |
| Daniel | black | Dafont |
Note: The Storybook UI includes the Nunito Sans webfont in the font-family declaration but does not require users to download it.
| Color | HEX value |
|---|---|
| Coral | #FF4785 |
| Ocean | #1EA7FD |
| Orange | #FC521F |
| Gold | #FFAE00 |
| Green | #66BF3C |
| Seafoam | #37D5D3 |
| Purple | #6F2CAC |
| Ultraviolet | #2A0481 |
| Monochrome | HEX value |
|---|---|
| Darkest | #333333 |
| Darker | #444444 |
| Dark | #666666 |
| Mediumdark | #999999 |
| Medium | #DDDDDD |
| Mediumlight | #EEEEEE |
| Light | #F3F3F3 |
| Lighter | #F8F8F8 |
| Lightest | #FFFFFF |
Share Storybook at work, meetups, and conferences. Get a head start on your slides with our ready-to-use presentation (Keynote, PDF).
Custom illustrations are located in /illustrations. For illustations used on the website go to storybooks/frontpage.
The intro video, source files, and assets are located in /video.
- Sacha Grief the awesome designer of the 2017 logo (which inspired the current logo and icon)
- Daniel Egerev the amazing video animator
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent