lightweight, simple, classless CSS framework inspired by new.css
devcss.devins.page
framework
lightweight
css
classless
stylesheet
1# intergrav/dev.css
2
3 [](https://github.com/intergrav/dev.css)
4
5Extremely simple, small, classless CSS framework in the style of Vercel's Geist. Inspired by [xz/new.css](https://github.com/xz/new.css).
6
7It weighs only **~5kb** and makes any plain HTML file look great.
8
9It has a light and dark theme, and the header turns into a sidebar on wider displays so that you get more vertical space.
10
11## Importing
12
13In your HTML's `<head>` all you have to write is this, and you're done! (`.min` means to minify the file)
14
15```html
16<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@1">
17```
18
19I also recommend adding a font through [intergrav/fonts](https://github.com/intergrav/fonts). Geist or Inter work with dev.css out of the box. It will use the default system/browser san-serif fonts otherwise.
20
21### Geist Font
22
23```html
24<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist.min.css">
25```
26```html
27<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist-mono.min.css">
28```
29
30### Inter Font
31
32```html
33<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/inter.min.css">
34```
35
36## Themes
37
38You can also use custom colors and custom fonts in dev.css through themes. See the `/theme` folder to view some premade ones. You can also copy the `boilerplate.css` and make a theme yourself. Simply apply it after the dev.css stylesheet. For example, to apply the terminal theme, put this after your main stylesheet:
39```html
40<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@1/theme/terminal.min.css">
41```