View showcase

Emotion hero components

15 heroes are styled using Emotion. A hero is a large banner or image that appears as one of the first items on a page. It’s a primary visual element that is used to focus user attention on key content or promotions. Emotion is a styling library that allows you to write styles in JavaScript. This technique is known as CSS-in-JS. When you write CSS alongside your JavaScript component files, you’re naturally encouraged to scope styling at the component level. Emotion is used to style 22 projects.

15components42storiesLast updated last month
Tweet
Add your component
Checkbox (selection control)
Natura Cosmeticos
10
Switch (selection control)
ChoiceGroup
Checkbox Group
ThemeProvider
CheckboxGroup
ChevronIcon
DoubleChevronIcon
HamburgerMenuIcon
InheritedSettingsIcon
Input State Help Text Provider
Form with error handler
UIKitThemeProvider
CheckboxGroup
HomePageHeroButtons
Docs
Documentation
Add Storybook to your project in less than a minute to build components faster and easier.
reactvueangularweb-components
Tutorial
Tutorials
Learn Storybook with in-depth tutorials that teaches Storybook best practices. Follow along with code samples.
Learn Storybook now
Storybook
The MIT License (MIT). Website design by @domyen and the awesome Storybook community.
StorybookShowcaseDocsTutorialsAddonsBlogReleasesGet involvedUse casesSupportTeam
Subscribe
Get news, free tutorials, and Storybook tips emailed to you.

Maintained by
Chromatic
Continuous integration by
CircleCI
Hosting by
Netlify