PIXSS

A pragmatical css for Minimalist

Pixss provides a minimal setup of styles for a programatic and clean starting point. It is specially designed for better performance and higher productivity. Only 4 kb gzipped!

🎯 Small but good enough 🎯

get the things done faster with pixss

# Install

 npm install pixss

Then use the css files from node_modules/pixss

├── dist
│   └── styles
│       ├── pixss.css
│       ├── pixss.css.map
│       ├── pixss.min.css
│       └── pixss.min.css.map

# Customize the SCSS

pixss is simple to be customized by changing the the variables in the following sass files:

_Base.sass
_Breakpoint.sass
_Color.sass
_Typography.sass

src/
└── styles
    ├── base
    │   ├── _Base.sass
    │   ├── _Breakpoint.sass
    │   ├── _Color.sass
    │   ├── _Elements.sass
    │   ├── _Reset.sass
    │   └── _Typography.sass
    ├── form
    │   ├── _Button.sass
    │   ├── _Checkbox.sass
    │   └── _Form.sass
    ├── layout
    │   ├── _Container.sass
    │   ├── _Footer.sass
    │   ├── _Grid.sass
    │   └── _Hero.sass
    ├── navigation
    │   ├── _Sidebar.sass
    │   ├── _Tabs.sass
    │   └── _Topbar.sass
    ├── pixss.sass
    ├── utils
    │   ├── _Icons.sass
    │   ├── _Spacing.sass
    │   └── _Utility.sass
    └── widget
        ├── _Card.sass
        ├── _Popup.sass
        └── _Showcase.sass

# Start the development

 npm run dev

# Build the source code

 npm run build

# Publish to NPM

build the source code and push the changes to the repository, then publish to NPM

 npm version minor
 npm publish

# License

Layout →