tiny, simple, classless CSS framework inspired by new.css devcss.devins.page
framework lightweight css classless stylesheet
CSS 56.6%
HTML 43.4%
21 1 0

Clone this repository

https://tangled.org/devins.page/dev.css
git@knot.devins.page:devins.page/dev.css

For self-hosted knots, clone URLs may differ based on your setup.

README.md

intergrav/dev.css#

jsDelivr hits (npm) GitHub Repo stars

Extremely simple, small, classless CSS framework in the style of Vercel's Geist. Inspired by xz/new.css.

It weighs only ~5kb and makes any plain HTML file look great.

It has a light and dark theme, and the header turns into a sidebar on wider displays so that you get more vertical space.

Importing#

In your HTML's <head> all you have to write is this, and you're done! (.min means to minify the file)

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@1">

I also recommend adding a font through intergrav/fonts. Geist or Inter work with dev.css out of the box. It will use the default system/browser san-serif fonts otherwise.

Geist Font#

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist-mono.min.css">

Inter Font#

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/inter.min.css">

Themes#

You 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:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@1/theme/terminal.min.css">