bl CSS

A hackable, blueviolet, ultra lightweight CSS framework!

bl-css is supposed to be a CSS framework that is Ultra Lightweight, even while being readable! Currently its <9KB (Unminified, With Comments, and Readable)! exactly 8.36KB from mothereff.in

v0.16.0 - Ugly Tables

I do NOT know how to style tables at all (found out :D) so please just don't use the table classes, write your own i dont know T-T .tbl - the main class .th - table heading .td - table data how do people even make good tables?!

Preview

How to Change Accent Color and Fonts?

To change from the original blueviolet theme and fonts you have to open the mainbl.css file and you can change the following:

:root{
  --_: rgb(/* Your accent's RGB here */);
  --_4: rgba(/* Your RGB */, 0.4);
  --_6: rgba(/* Your RGB */, 0.6);
  --h: /* The font you want for headings */;
  --p: /* The font you want for paras */;
  --m: /* The font you want for monospace */;
  --bg: /* The color you want for background */;
  --f: /* The color you want for foreground/text */
}

Repo

The bl-css repo is on GitHub

You can also make an issue on GitHub to request features

How to use?

Plug 'n' Play (not recommended for big sites)

Add this to your HTML for the latest&greatest version:

<link rel='stylesheet' href='https://esm.sh/bl-css' />

Its a very short URL too! (credit to esm.sh)

Download

1. NPM

This is the most recommended method

Run this in your terminal(for latest version):

npm install bl-css

If you'd want, you can target a specific version:

npm install bl-css@version
# note: version to be replaced with actual version or the alien will eat bl-css

2. GitHub

This is not recommended as I most of the time forget to make a release on github T-T

Go to the official GitHub repo releases and download a certain version you want.

Not AI Generated

This is all my dumbness into a css framework :D

and:

Pleaseee Star my github repo :P here

Have a Nice day Using it :D

Forever Free :D