A minimalist front-end design toolkit built with Sass for developing responsive, browser-consistent web apps. Primitive also provides helpful, browser-consistent styling for default HTML elements - buttons, forms, tables, lists, and typography.
- Download the stylesheet or use the CDN URL: https://unpkg.com/primitive-ui/dist/css/main.css.
- Save the stylesheet and link to it in the head of your project.
<link rel="stylesheet" href="https://unpkg.com/primitive-ui/dist/css/main.css">
It's all set to go and your HTML elements will be given sensible default styling.
The beauty of Primitive is the ease with which you can create unique designs in a beautiful, simple system. Simply clone the repo:
git clone https://github.com/taniarascia/primitive.git
cd primitive
And run a Sass watch on the project.
npm run sass
Now you can begin modifying variables in variables.scss
. This file will define your colors, typography, sizes, breakpoints, buttons, borders, and more. Define all your variables here to keep your project organized.
You can view dist/test.html
or templates/template.html
to see some example elements as you make changes.
All documentation can be found at https://taniarascia.github.io/primitive.
Primitive was originally built by Tania Rascia to understand how a responsive CSS framework works from scratch, and how to use Sass, the CSS preprocessor.
Primitive makes it incredibly simple to set the foundation for a sustainable styling system. You get the freedom to design your site however you want, with a solid, easy-to-understand underlying framework.
Many websites have been built with Primitive, such as taniarascia.com, Laconia, Cafe Ba-Ba-Reeba!, Shaw's Crab House, Tokio Pub, Krispy Kreme Pacific Northwest, and more.
- Dave Gamache for building Skeleton CSS, the original inspiration for building Primitive and understanding responsive CSS.
Please feel free to fork, comment, critique, or submit a pull request.
This project is open source and available under the MIT License.