Introduction
TL;DR It's a collection of Vue components that you can copy to your projects with npx commands. You have full control over customization. Is it actually any good? - Yes.
About
SIGMA-UI is a collection of fully customizable well-built components and blocks for Vue, using newly invented GOAT (Git Obtained As Template) installation method.
It takes away the burden of recreating the same components from scratch for every new project, giving you components that you can quickly modify to your design system.
- Supported frameworks: Vue, Nuxt, Laravel, Astro.
- Supported vue versions: 3 and above.
- Style systems: CSS, Tailwind.
- Open Sourced: Yes, MIT licensed.
- Accessibility: Supported.
- Based upon: Radix Vue primitives.
- Installation method: GOAT (Git Obtained As Template) via npx commands. Unlike NPM modules, these components are copied from git repository directly into your project's components directory and give you full control over customization, instead of using just props and css overrides.
- Main problem it solves: You are a developer, you create a new project, it needs 20+ components like dialogs, selects, skeletons, etc, and they all need to follow your companies' / your own design system.
- Beta devs - spend half a year creating every component from scratch for every new project they work in and end up with a broken buggy mess, or use Vuetify / Quasar like library and monkey patch components' css with
!important, trying to make them look like components in their design system. - Sigma devs - have GOAT in their stack, use well designed customizable components, easily modify design and functionality to their needs. Profit.
- Beta devs - spend half a year creating every component from scratch for every new project they work in and end up with a broken buggy mess, or use Vuetify / Quasar like library and monkey patch components' css with
Credits
Created and maintained by Aleksey Hoffman.
Thanks to all open-source projects and developers who have inspired and contributed to the foundation that led to the creation of this project:
Radix, Shadcn, VueUse, Zernonia, and others.
License
FAQ
Because GOAT is superior to NPM when it comes to distributing components.
When you install components as NPM dependencies to your project, their style is coupled with their implementation, making it difficult to customize the components to your style system.
This library gives you the building blocks to create your own components that match your design system.
I wanted to create this installation method for a long time. So long that some people got ahead of me and created first implementations of it before me. Now, finally the time has come for the GOAT to shine.
When you install components as NPM dependencies to your project, their style is coupled with their implementation, making it difficult to customize the components to your style system.
This library gives you the building blocks to create your own components that match your design system.
I wanted to create this installation method for a long time. So long that some people got ahead of me and created first implementations of it before me. Now, finally the time has come for the GOAT to shine.
Most UI libraries give you components with some design system baked in. It's very difficult to customize them (or even impossible, things like backdrop filters on animated components in Vuetify).
This library gives you the building blocks to create your own components that match your design system.
This library gives you the building blocks to create your own components that match your design system.
Currently, it works with Vue (vite), Nuxt, Laravel, Astro.
Yes. Free to use in personal and commercial projects. Attribution is not required but very appreciated. If you can, spread the word about this library to other people, it would help this project to grow and evolve.