❤️ Creative Tim Club - Access all our Present & Future Premium Products

Free Bootstrap 4 Vuejs Design System

Product description


Start your development with a Design System for Bootstrap 4. It is open source, free and it features many components that can help you create amazing websites.

Fully Coded Components

Vue Argon Design System is built with over 100 individual components, giving you the freedom of choosing and combining. All components can take variations in colour, that you can easily modify using SASS files.

You will save a lot of time going from prototyping to full-functional code, because all elements are implemented. This Design System is coming with prebuilt examples, so the development process is seamless, switching from our pages to the real website is very easy to be done.

Every element has multiple states for colors, styles, hover, focus, that you can easily access and use.

View all components here

Complex Documentation

Each element is well presented in a very complex documentation. You can read more about the idea behind this design system here. You can check the components here and the foundation here.

Example Pages

If you want to get inspiration or just show something directly to your clients, you can jump start your development with our pre-built example pages. You will be able to quickly set up the basic structure for your web project.

View example pages here.

Product certified by: Creative Tim
Vue Argon Design System - Fully Coded and Responsive HTML5
Vue Argon Design System - Sass Files for Professional Front End Developers
Vue Argon Design System - Photoshop Files for Professional Designers
Vue Argon Design System - Sketch Files for Professional Designers
Vue Argon Design System - Crafted with Bootstrap - the most popular Front End Framework
Vue Argon Design System - The Progressive JavaScript Framework
Vue Argon Design System - Figma Files for Professional Designers
Downloads
48,470
Version
1.1.0
Changelog
Updated
5 years ago
Released
5 years ago
Reviews
Star
Handcrafted Elements
26
Customized Plugins
3
Example Pages
4
Community Support
Documentation
Fully Responsive

We are here to help you!

74 Web Developers commented on this product

alissonpelizaro
  • downloaded
5 years ago

Perfect to me! Thanks guys...

devin.gray.email
  • downloaded
5 years ago

Awesome system, is there a plan for a dashboard? and a pro version?

cristi.jora
  • downloaded

@devin.gray.email Glad you like it and yes, there will be a dashboard and PRO version but after a couple of weeks from now.
5 years ago

devin.gray.email
  • downloaded
5 years ago

@crcristi.jora cool cool beans, I have taken the liberty of adding this to a node backend server, also removed webpack, because who has time for that... have a look https://github.com/devingray/node-api

shilu911 5 years ago

This is amazing! Do you have plan to add SideNav?

tomsrc 5 years ago

Wow, this looks awesome guys, really great job. Can I use this for commercial use? @cristi.jora

cristi.jora
  • downloaded

@tomsrc This one is MIT licencen, so yes, you can use it however you want but you have to keep a copyright in the code that references this product.
5 years ago

tomsrc

Hi @cristi.jora Thanks for your response. What you mean in "keep a copyright in the code that references this product" Do I need to add copyright or something in the footer of every page? or just to leave the code copyright as is? where does it show? in every file or what? Please let me understand how MIT works :) I read about this but I didn't really understand. And again - Great job man!
5 years ago

cristi.jora
  • downloaded

@tomsrc Just leave the copyright in the code as it is. No need to display it on every page. MIT licence basically lets you do pretty much anything you want with that specific product
5 years ago

atienzaraychard
  • downloaded
5 years ago

This is amazing! Can I use this as my Website Template?

cristi.jora
  • downloaded

Thanks @atienzaraychard Gld you like it. Sure, you can use it for whatever you want. It's MIT licence
5 years ago

patnaik.kaur 5 years ago

Bro,i love this vue argon design system very much and i have a small issue about cards are not located in this beautiful ui kit

alexenoki
  • downloaded
5 years ago

@cristi.jora I barely got started with Vue and Vue CLI and this theme teaches me a lot only by seeing it. Is some kind of trick for this theme that i cannot set environment variables the Vue CLI 3 way? Because i try to use environment variables with this theme and process.ENV is always undefined.

cristi.jora
  • downloaded

You should be able to set any environment variables according to Vue CLI docs https://cli.vuejs.org/guide/mode-and-env.html The catch is to place the variables inside `.env` files and start them with `VUE_APP_` prefix
5 years ago

alexenoki
  • downloaded

I am not the smartest guy. Using process.ENV instead of process.env (lowercase env) c':
5 years ago

oldsheepranchinn
  • downloaded
5 years ago

Very cool, thanks guys this is just what I was looking for. It even has a date range picker already bootstrapped! I am a beginner in Vue, self taught, and am wondering why this is a served website instead of a server side rendered. Maybe I'm mistaken but it seems this site can't be hosted statically? I appreciate any help, I may figure it out as I work with your 'design system.'

cristi.jora
  • downloaded

Hello @oldsheepranchinn Thanks for your interest in this product. Indeed this is built as a simple SPA because it's easier for us to host it. You can server side render it with the help of plugins such as this https://github.com/Akryum/vue-cli-plugin-ssr
5 years ago

jryan719
  • downloaded
5 years ago

It looks like the Vue version of argon is missing the "Headroom" plugin for the nav?

cristi.jora
  • downloaded

You're right @jryan719 We will add it in the next update
5 years ago

You have to be logged in to post a comment. Login here.