SvelteIt UX/UI Library
247 Words ~2 Minute Reading Time • Subscribe to receive updates on Svelte
This post was originally posted on my old blog and I have not tested it with the latest versions of Svelte
SvelteIt is a minimal UI/UX component library for Svelte and Sapper projects
v1.0.0-alpha.6
Out of the box, we're launching with ~30 SvelteIt components and plan to add more throughout our journey. Admittedly so, this is our first take on writing UI components for the open source community. We imagine this journey will be exciting at times and painful at others. For now, we're having fun!
Why?
Yes, there are many component libraries out there today, but we wanted our own. If you like our components, use it. If you see a problem, make a pull request or fork your own and roll with it.
Screenshots
Examples
In this example, you can add a Card component in a couple of ways.
<script>
import { Card, Button } from '@colorfuldots/svelteit'
</script>
<Card>
<h3>I have a title</h3>
<p>I have a description</p>
<Button success rounded medium outlined>I have a button, Baby!</Button>
</Card>
<!-- OR you could do it like this -->
<Card
title="I have a title"
description="I have a description"
buttonComponent={<Button success rounded medium outlined>I have a button, Baby!</Button>}
/>
Documentation
Thanks for reading. Happy coding!
Supporting My Work
Please consider Buying Me A Coffee. I work hard to bring you my best content and any support would be greatly appreciated. Thank you for your support!
Contact