Version picker
All 238 CDN files of the Pico CSS v2.1.1 set, how their names combine, and the extras on top.
On this page
Pico Reforged ships the same 238 files as Pico CSS v2.1.1, with the same names, in the css/ folder. Every file also has an unminified twin without .min. On top of that there are 24 files for the opt-in extras.
How names combine
A name is built from the build, an optional theme and the suffix:
pico[.fluid][.classless][.conditional][.<theme>][.min].cssOnly the combinations in the table below exist. The default theme is azure, and it has no theme part: pico.min.css is azure.
| Build | Stem | Themes | Files |
|---|---|---|---|
| Class (default) | pico | azure (no part) + 19 others | 40 |
| Class-less | pico.classless | azure (no part) + 19 others | 40 |
Conditional, scoped to .pico | pico.conditional | azure (no part) + 19 others | 40 |
| Class-less, conditional | pico. | 19 others, no azure file | 38 |
| Fluid class-less | pico.fluid.classless | azure (no part) + 19 others | 40 |
| Fluid class-less, conditional | pico. | 19 others, no azure file | 38 |
| Color utility classes | pico.colors | none | 2 |
That is 236 files for the six builds plus 2 for colors, 238 in all, counting the minified and the unminified file of each. Upstream never published an azure file for the two scoped class-less builds, and neither does this project. To get one, build it: pico-reforged .
Themes
amber, blue, cyan, fuchsia, green, grey, indigo, jade, lime, orange, pink, pumpkin, purple, red, sand, slate, violet, yellow and zinc, plus azure as the default. Put the theme name after the build stem:
pico.jade.min.css
pico.classless.jade.min.css
pico.conditional.jade.min.css
pico.classless.conditional.jade.min.css
pico.fluid.classless.jade.min.css
pico.fluid.classless.conditional.jade.min.cssFor a color that is not in the list, build a theme from one color with the CLI or the integrations.
Extras
The extras are not part of the 238. They are layered, carry their own tokens, and load after the main file.
| File | What it is |
|---|---|
pico.extras.min.css | all eleven extras |
extras/<name>.min.css | one extra: tabs, alert, toast, badge, avatar, skeleton, app-shell, data-table, pagination, stepper, empty-state |
That is 2 files for pico.extras and 22 under extras/, 24 in total. See Extras.
Pick a file
Choose the options and copy the link. This uses the same naming rules as the table above.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rusticstack/pico-reforged@2/css/pico.min.css" />