dikshu2004/uiforge ? reverse-engineered prompt

Reverse engineered prompt

Build me a lightweight UI library and design system for a website, using plain HTML, SCSS, and vanilla JavaScript. I want reusable styles for common stuff like buttons, badges, cards, alerts, avatars, navbars, forms with validation, dropdowns, tabs, and pagination. Please also include a simple 12 column responsive grid and handy utility classes for spacing, layout, alignment, and typography.

Make it easy to use in a normal project, with a clean compiled CSS file I can import or load from a CDN. I’d like the design tokens set up with CSS variables so the colors, spacing, borders, and motion feel consistent, and the whole thing should support light and dark mode switching smoothly.

Please also include a small demo page or documentation page showing how each component looks and how to use it. Keep it modern, reusable, and simple, with no heavy frameworks. If you need to check anything, look up the current docs online first.

Are you gonna build this?

make sure you review the code using coderabbit

Try freeSponsored — opens CodeRabbit in a new tab