Sumi is a framework agnostic Storybook components inspired by Japanese sumi-e art style.
All components simply exports encapsulated CSS classes, allowing the use in any JS frameworks.
Import them as you like, customize the style, and use the exported classes on your JS components.
Sumi is intended to provide a simple, user-friendly, and accessible UI component styles that is portable via CSS-in-JS technique.
The theme is composed of white, shades of gray, and black. This is the perfect theme to let your content (text and image) shine.
- Keep the original theme and let your content (text and image) shine.
- Use it as a starting point for your theme customization.
- Defer the design decision and focus on rapid prototyping.
Base Styles & Utilities
Base style definitions and utilities are found in /src/styles. This is where you want to control globally applied styles that gets imported in the main components.
Components can be found in /src/components. Many of them are dependent on base style and utilities.
Stories document components you build found in /stories. Use them as you see fit for you and your team.
This project includes a simple node script that generates number of files based on boilerplate to save you time.
npm run create ComponentName