miukimiu/react-kawaii
Cute SVG React Components
| repo name | miukimiu/react-kawaii |
| repo link | https://github.com/miukimiu/react-kawaii |
| homepage | https://react-kawaii.now.sh/ |
| language | JavaScript |
| size (curr.) | 43343 kB |
| stars (curr.) | 2281 |
| created | 2017-01-22 |
| license | MIT License |
React Kawaii
React Kawaii is a library of cute SVG illustrations (react components). Ideal if you want to give some cuteness and personality to your react application.
Example
Install
With npm:
npm install --save react-kawaii
With yarn:
yarn add react-kawaii
How to use
import { Planet } from 'react-kawaii';
const Example = () => <Planet size={200} mood="blissful" color="#FDA7DC" />;
How to use with React Native
import { Planet } from 'react-kawaii/lib/native/';
const Example = () => <Planet size={200} mood="blissful" color="#FDA7DC" />;
Depending on your react and react-native version, you might need to to install the package
react-native-svg:
With npm:
npm install react-native-svg
With yarn:
yarn add react-native-svg
Link react-native:
react-native link react-native-svg
Read the react-native-svg documentation in case you need help.
Development
So you want to help developing some cute UI components?
If you want to develop a component
-
npm i -
npm run styleguide
If you want to build
npm run styleguide:build
Documentation
See https://react-kawaii.now.sh/
Components
All the components are SVG illustrations. You can pick different moods: sad, shocked, happy, blissful and lovestruck. You can also choose a color to your Kawaii and the size.
Available components:
- Backpack - A cute backpack
- Browser - A cute browser
- Cat - A cute cat
- Chocolate - A cute chocolate
- CreditCard - A cute credit card
- File - A cute file
- Ghost - A cute ghost
- IceCream - A cute ice-cream
- Mug - A cute mug
- Planet - A cute planet
- SpeechBubble - A cute speech bubble
- More Kawaii components coming soon…
Contributors
Thanks to everyone who has contributed to this project! You can find the contributors list here.
