Simple progressive design system and documentation for personal projects.
- ✌️ Simple: Less is better. Simple to maintain, compose and evolve.
- 👍 Intuitive: UI and animations should provide intuitive feedback to users.
- 👉 Progressive: Favor rapid progressive development over features.
- Colors
- Typography
- Iconography
- Animations
- React components
octiconsreactreact-springrebassstyled-componentstypography
Components are progressively documented in markdown (mdx) format using docz.
To run the documented examples:
yarn add @chrisrzhou/ui
cd ui
yarn
yarn devProgress(line/donut with color)ModalDrawer(like modal)CollapseBadgeHugAnchorProviderBannerTimelineCarouselBreadcrumbCheckboxCheckboxListFormField(usesInput,Label, similar toFormRow)Form(usesFormField)Input(number, string, email, password, textarea, validation)LabelRateRadioRadioListSelectSelectOptionSliderTabSetToggleButtonListDatePickerColorPicker- Add documentation for
css.js. - Group components (data, input, display, navigation etc)