All Projects β†’ viljamis β†’ Vue Design System

viljamis / Vue Design System

Licence: mit
An open source tool for building UI Design Systems with Vue.js

Programming Languages

javascript
184084 projects - #8 most used programming language
Vue
7211 projects
SCSS
7915 projects
HTML
75241 projects

Projects that are alternatives of or similar to Vue Design System

fast-blazor
Blazor component library for FluentUI. Microsoft's official lightweight wrapper around the FluentUI Web Components for use with .NET 6.0 Blazor applications
Stars: ✭ 928 (-55.32%)
Mutual labels:  components, design-systems, component-library
Neumorphic Ui
πŸ“š A library of components based on the concept of neumorphism
Stars: ✭ 82 (-96.05%)
Mutual labels:  design-systems, components, component-library
design-systems
A list of famous design systems, design languages and guidelines
Stars: ✭ 403 (-80.6%)
Mutual labels:  design-systems, component-library, design-system
React95
πŸŒˆπŸ•Ή Refreshed Windows 95 style UI components for your React app
Stars: ✭ 4,877 (+134.81%)
Mutual labels:  design-system, components, component-library
Design System
Priceline.com Design System
Stars: ✭ 604 (-70.92%)
Mutual labels:  design-system, design-systems, components
Clarity
Clarity is a scalable, accessible, customizable, open source design system built with web components. Works with any JavaScript framework, built for enterprises, and designed to be inclusive.
Stars: ✭ 6,398 (+208.04%)
Mutual labels:  design-system, component-library, components
Fast
The adaptive interface system for modern web experiences.
Stars: ✭ 6,532 (+214.49%)
Mutual labels:  design-systems, components, component-library
Vue Cion Design System
CION - Design system boilerplate for Vue.js
Stars: ✭ 119 (-94.27%)
Mutual labels:  design-system, design-systems, components
Calcite Components
Web Components for the Calcite Design System. Built with Stencil JS. Currently in Beta!
Stars: ✭ 96 (-95.38%)
Mutual labels:  design-system, components
Leaf Ui
πŸƒ Leaf-UI: A react component library built using styled-components
Stars: ✭ 98 (-95.28%)
Mutual labels:  design-system, components
Uniforms
A React library for building forms from any schema.
Stars: ✭ 1,368 (-34.14%)
Mutual labels:  components, component-library
Aksara Ui
Aksara Design System, from Kata.ai.
Stars: ✭ 107 (-94.85%)
Mutual labels:  design-system, component-library
Purescript Ocelot
An opinionated component library for Halogen apps
Stars: ✭ 81 (-96.1%)
Mutual labels:  design-system, component-library
Taiga Ui
Angular UI Kit and components library for awesome people
Stars: ✭ 1,353 (-34.86%)
Mutual labels:  components, component-library
Ft Origami
The Old Origami Website, do not use
Stars: ✭ 80 (-96.15%)
Mutual labels:  design-systems, component-library
Barista
Barista - the Dynatrace design system. Tailored to scale.
Stars: ✭ 107 (-94.85%)
Mutual labels:  design-system, component-library
Interior
Design system for the modern web.
Stars: ✭ 77 (-96.29%)
Mutual labels:  design-system, design-systems
Nostyle
Design System
Stars: ✭ 101 (-95.14%)
Mutual labels:  design-systems, component-library
Css
The CSS design system that powers GitHub
Stars: ✭ 10,670 (+413.72%)
Mutual labels:  design-system, design-systems
React
Modern and minimalist React UI library.
Stars: ✭ 2,546 (+22.58%)
Mutual labels:  design-system, design-systems

Build status Dependencies status MIT License Gitter

Vue Design System

Vue Design System is an open source tool for building UI Design Systems with Vue.js. It provides you and your team a set of organized tools, patterns & practices that work as the foundation for your application development.

The tool is built on top of Vue.js, Vue Styleguidist, Webpack, and Theo and is aimed for designers and front-end developers who have at least basic knowledge of component based workflows + HTML, SCSS & JavaScript.

Made by @viljamis and other contributors. See also the official website of Vue Design System and read my article on the processes and workflow I use to get started with a new design system project.

Screenshot

Features

  • A set of interconnected patterns & practices for you and your team.
  • A well thought-out terminology, naming conventions, and hierarchy.
  • Get an automated overview of how your design system progresses over time.
  • Global design tokens in YAML format that you can use inside any component.
  • Automatic generation of living, user editable documentation.
  • Easily export and use your Design System as an NPM dependency in another Vue.js or Nuxt.js project.
  • Create a token, an element, or a pattern, and it’s immediately available across all components.
  • Pre-configured Prettier setup for auto-formatting code on both save and before commit.
  • Live Reloading, Autoprefixing, SCSS, and helper functions + simple and sane defaults for SVG and Webfont usage out-of-the-box.
  • Documentation and the app logic are separated, so you can have public docs while the app itself stays private.
  • And more…

Documentation

Examples

Roadmap

Changelog

  • 3.5.7 is the latest release.
  • See Releases page for the full changelog.

Need more help?

About to get started with a new design system? I’m an independent designer and developer, specialized in helping companies to build design systems. I also conduct design system workshops and do consulting. Let’s talk!

Authors and License

Viljami Salminen, Artem Sapegin, Rafael Escala, react-styleguidist contributors, vue-styleguidist contributors, Vue.js contributors, vue-webpack-boilerplate contributors, Theo contributors, and Polaris contributors.

Licensed under the MIT license.

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].