facebook Clutch Top custom software development companies

Open source tool for building UI Design Systems with Vue.js

Open source tool for building UI Design Systems with Vue.js
Average rating: 0
(0 votes)

Thanks! You’ve rated this material!

Look what we have found! Vue Design System is an open source tool for building UI Design Systems with Vue.js. It provides you with a set of organized tools, patterns & practices which work as the foundation for your application development.

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

Vue Design Systems serves as a resource that helps to define a common visual language for the components of this application. Everything you see on demo documentation is user editable.

Vue Design Systems’ 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 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.

More information can be found on their VUEDS site.

By the way, do you know that Vue.js is the perfect solution as the frontend for Rails?

Rate this article, if you like it

Thanks! You’ve rated this material!

Got a project? Let's discuss it!

*By submitting this form you agree with our Privacy Policy.

Mailing & Legal Address

Syndicode Inc. 340 S Lemon Ave #3299, Walnut CA, 91789, USA

Visiting & Headquarters address
Kyiv Sofiivska 1/2a, 01001, Kyiv, Ukraine
Dnipro Hlinky 2, of. 1003, 49000, Dnipro, Ukraine
Email info@syndicode.com
Phone (+1) 9035021111