FlexCSS

A flexible CSS libary which is minimal and easy to read.

FlexScript

The FlexCSS has custom Stylus Inspired Domain Specific Language (DSL) called FlexScript.
The flex-cli doesnt care about the exetention of FlexScript but it is recommended to use the:
.flex exetention.
Like: ui.flex

Quick Start | CLI

Paste this inside a file like: card.flex
``flexscript
.card {
fusion-gradient, shadow-xl, rounded
}
`
Run npx flex-cli transpill card.flex -o card.css and after this it is expected to show the css below in the card.css:
`css
.card {
background: linear-gradient(135deg, #4776E6, #8E54E9);
box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
border-radius: 50px
}
`

There is also another command: npx flex-cli watch card.flex -o card.css.
This will use the watchFile() function from the node:fs to change the output on change.


Common errors:


If the flexcss-cli command doesn't work (common on Linux).
Try to go in the node_modules folder and run chmod +x cli.js` for the FlexCSS-CLI to run as executable.

$3

Flex CSS documentation