sonnylazuardi / Sonwan Ui
Licence: 0bsd
SonWan UI is a modular UI component library based on figma design to build your next React Web Application.
Stars: ✭ 75
Projects that are alternatives of or similar to Sonwan Ui
Notus Svelte
Notus Svelte: Free Tailwind CSS UI Kit and Admin
Stars: ✭ 144 (+92%)
Mutual labels: uikit, tailwindcss
Vuent
🎨 Vue.js components implementing Microsoft Fluent Design
Stars: ✭ 207 (+176%)
Mutual labels: library, uikit
Notus Nextjs
Notus NextJS: Free Tailwind CSS UI Kit and Admin
Stars: ✭ 152 (+102.67%)
Mutual labels: uikit, tailwindcss
Vue Notus
Vue Notus: Free Tailwind CSS UI Kit and Admin
Stars: ✭ 108 (+44%)
Mutual labels: uikit, tailwindcss
nextly-template
Nextly Landing Page Template built with Next.js & TailwindCSS
Stars: ✭ 48 (-36%)
Mutual labels: uikit, tailwindcss
Notus React
Notus React: Free Tailwind CSS UI Kit and Admin
Stars: ✭ 173 (+130.67%)
Mutual labels: uikit, tailwindcss
Dashboard
🛩 🧶 Dashboard template built with tailwindcss.
Stars: ✭ 202 (+169.33%)
Mutual labels: uikit, tailwindcss
Swift Essentials
A set of essential Swift stuff I use in every single iOS app.
Stars: ✭ 223 (+197.33%)
Mutual labels: library, uikit
e-commerce
🧧🕹 E-commerce website built with Tailwind CSS
Stars: ✭ 91 (+21.33%)
Mutual labels: uikit, tailwindcss
Alertift
Swifty, modern UIAlertController wrapper.
Stars: ✭ 242 (+222.67%)
Mutual labels: library, uikit
Tail Kit
Tail-kit is a free and open source components and templates kit fully coded with Tailwind css 2.0.
Stars: ✭ 997 (+1229.33%)
Mutual labels: uikit, tailwindcss
Shadowview
An iOS Library that makes shadows management easy on UIView.
Stars: ✭ 391 (+421.33%)
Mutual labels: library, uikit
Tailwindcss Sketch Kit
💎 Sketch UI kit for Tailwind CSS
Stars: ✭ 68 (-9.33%)
Mutual labels: uikit, tailwindcss
Byline
Go library for convert io.Reader to line-by-line Reader
Stars: ✭ 80 (+6.67%)
Mutual labels: library
Sizes
View your app on different device and font sizes
Stars: ✭ 1,213 (+1517.33%)
Mutual labels: uikit
Stts
A starter template for Svelte, Tailwind, Typescript, and Snowpack
Stars: ✭ 78 (+4%)
Mutual labels: tailwindcss
SonWan UI
🚀 Quick start
-
Start developing.
Navigate into your new site’s directory and start it up.
yarn start
Getting started with SonWan UI
Inside your React project directory install SonWan UI by running the following
npm i sonwan-ui
# or
yarn add sonwan-ui
Then import the css styling and js components by including this code in your js/tsx file
import "sonwan-ui/build/style.min.css";
import SonWan from "sonwan-ui";
To use it, just simply render the component in your render function
const { Input, Switch, Card, CardItem, ListItem } = SonWan;
return (
<>
<Input placeholder="Search In Codesandbox" />
<Card>
<CardItem
title="Yuzuha Usagi"
subtitle="0821 - 7654 - 3210"
/>
</Card>
</>
);
Demo
Demo: CodeSandbox
Demo Chat UI: SonWan Chat UI Code: SonWan Chat Github
React Native Support
Please check out https://github.com/Drzaln/SonWanUI-RN
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].