Skip to content

Design system to help keep UI design ship shape and Bristol fashion

Notifications You must be signed in to change notification settings

maxmckenzie/bristol-fashion

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

96 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Bristol fashion logo

Documentation: https://bristol-fashion.now.sh/

Bristol fashion is a collection of design system variables and modifiers and default, rather than providing developers with a UI framework such as Bootstrap and Foundation. Bristol provides the variables and modifiers you need to roll your own based around core design theory.

GitHub Workflow Status npm

Install

You can include just the CDN if you would like to https://bristol-fashion.now.sh/styles.css

Including this in your head will include all of the CSS and all of the browser defaults that come with it.

<link rel="stylesheet" href="https://bristol-fashion.now.sh/styles.css">

or yarn add bristol-fashion or npm i bristol-fashion depending on your preference.

Features

  • normalize.css
  • Typography utility for type scale calculation and browser defaults
  • Color CSS variables are broken down into Brand, Pallet, neutral, and UI
  • Modifier classes with ._
  • Inset and drop shadow modifiers
  • Text size modifiers
  • Visibility modifiers
  • Content modifiers
  • Image modifiers
  • Spacing modifiers

Design resources

If you are new to web development/design and need some guidance, we suggest taking a look at this fantastic guide https://www.internetingishard.com/

To learn the fundamentals of design UI check out https://refactoringui.com/

If you like you can up-vote this project on product hunt

Bristol Fashion - Design system to keep web UI ship shape and Bristol fashion | Product Hunt Embed

About

Design system to help keep UI design ship shape and Bristol fashion

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published