ldcss
A dependency-free CSS + JS framework, class- and attribute-driven. Pick a destination below.
Components
Demo
Every component and utility rendered live — buttons, cards, forms,
overlays, tabs, and the full changelog.
Reference
Cheat sheet
Every
ld-* class,
data-ld-* attribute and JavaScript call, in pages with explanations,
examples and fuzzy search.
Layout
Sidebar demo
The sidebar app shell: a sticky column on wide screens that becomes a
top bar with a dropdown menu on small ones.
npm run build
writes dist/ from src/;
npm run watch rebuilds on every change
Files in this project
What you link, and what you edit
| File | Purpose |
|---|---|
dist/ldcss.css, dist/ldcss.min.css |
The stylesheet — tokens, components, utilities, in cascade layers. Link this one. |
dist/ldcss.js, dist/ldcss.min.js |
Behaviour for toggles, overlays, tables, search, toasts, and so on. Link this one too. |
dist/ldcss-theme.js |
Optional 0.3 KB script for <head>: applies a saved theme
before the first paint, so there is no flash. |
dist/fonts/ |
Self-hosted JetBrains Mono. Keep it next to the CSS file. |
src/, build/ |
The source and the build script. Edit these, then run npm run build. |
demo.html, demo-sidebar.html
|
Live component gallery with the version changelog, and the sidebar shell. |
cheat-sheet.html |
The searchable reference. |
README.md, CHANGELOG.md |
Usage docs and the release notes. |