Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/vantagedesign/solid-design-system

A design system for web development with Bootstrap 4, inspired by material design.
https://github.com/vantagedesign/solid-design-system

bootstrap4 design-system design-systems free gulpjs html5 javascript scss ui-kit

Last synced: about 1 month ago
JSON representation

A design system for web development with Bootstrap 4, inspired by material design.

Awesome Lists containing this project

README 

        
# [Solid design system](https://docs.vantage-design.com/solid/demo)



![Product thumbnail](https://raw.githubusercontent.com/vantagedesign/assets/master/solid-design-system/solid-thumbnail-shadow.png)



Solid design system is a feature-complete design system, inspired by Google's Material Design and powered by Bootstrap 4. It features a ton of custom-styled components, handcrafted sections and beautiful ready-to-go example pages. Solid builds upon and extends Bootstrap with plugins such as a date & time picker, parallax, lightbox, carousels, tags, icons from Font Awesome, and more. Bootstrap and these plugins have all been styled according to the design language of Solid, and this combination of components and design forms the Solid design system. 



Besides a beautiful design and a ton of components, Solid feautures a powerful build workflow, powered by GulpJS. This enables you to write stylesheets with SASS CSS (SCSS) and provides concatenated and minified CSS, JavaScript and even images, to make your project as fast as possible for the end user. All features of Solid are extensively documented.



### Components

Solid features all of the standard Bootstrap 4 components and syntax, and more. Therefore, you can use your existing knowledge of Bootstrap. Use components such as butons, alerts, cards, dropdowns, navbars, navs, progress, and much more. 



Useful extensions have been included, such as flippable cards, a navbar that changes style on scrolling, and more.



### Plugins

Solid extends the basic Bootstrap components and features with a variety of plugins. These include tags, selects, carousels, lightboxes, parallax and more, which are part of the PRO version of Solid, but also features such as smooth scrolling and Font Awesome, which are included in the standard version of Solid.



### Handcrafted sections

Solid design system PRO includes more than 34 prebuilt, handcrafted sections which can be used to build your project. Sections include showcases for features, your team, projects, pricing, contact information, and much more. 



### Beautiful example pages

A handful of example pages is provided in Solid design system PRO to kickstart your project. Pages include a landing page, login page, error pages, blog list, blog article, a pricing page and more.



### Standard & PRO version

Solid design system comes in two variants, a standard version and a PRO version. The standard version includes a lot of components and functionality, with a beautiful design. The PRO version extends upon this and offers much more components, plugins, sections, example pages and other functionality, along with premium support. 



## Demo & documentation



- [Documentation](https://docs.vantage-design.com/solid)

- [Demo](https://docs.vantage-design.com/solid/demo)



## Installation



- [Download from GitHub](https://github.com/vantagedesign/solid-design-system/releases)

- [Purchase and download PRO version](https://vantage-design.com/products/design-systems/2/solid-design-system-pro)

- Clone the repo `git clone https://github.com/vantagedesign/solid-design-system.git`

- Follow the "[Getting started](https://docs.vantage-design.com/solid/getting-started/usage/)" steps in the documentation



## Resources



- [Store page](https://vantage-design.com/products/design-systems/3/solid-design-system)

- [Store page PRO version](https://vantage-design.com/products/design-systems/2/solid-design-system-pro)

- [Demo](https://docs.vantage-design.com/solid/demo)

- [Documentation](https://docs.vantage-design.com/solid)

- [Issues](https://github.com/vantagedesign/solid-design-system/issues)

- [License](https://github.com/vantagedesign/solid-design-system/blob/master/LICENSE.md)



## Reporting issues



We use GitHub Issues as the official bug tracker for the Solid design system. When reporting an issue, please follow the following guidelines:



1. Make sure that you are using the latest version of Solid.

2. Provide us with reproducible steps for recreating the issue, in order for us to find the issue and fix is as soon as possible.

3. Specify your browser and version of Solid.



## Licensing



- Copyright 2020 [Vantage Design](https://vantage-design.com)

- License: https://github.com/vantagedesign/solid-design-system/blob/master/LICENSE.md



## Useful links



- [More products](https://vantage-design.com)

- [Free products](https://vantage-design.com/products/free-products/)

- [Premium products](https://vantage-design.com/products/premium-products/)

- [Design sytems](https://vantage-design.com/products/design-systems/)

- [Page templates](https://vantage-design.com/products/page-templates/)

- [Documentation themes](https://vantage-design.com/products/documentation-themes/)



### Social media



- Facebook: 

- Instagram: