Light like an oat flake
8KB CSS, 3KB JS, minified + gzipped.
That's it.
Ultra-lightweight UI library
Semantic, minimal, zero dependencies. ~11KB CSS and JS.
Oat Glassed is an ultra-lightweight HTML + CSS, semantic UI component library with zero dependencies. No framework, build, or dev complexity. Just include the tiny CSS and JS files and you are good to go building decent looking web applications with most commonly needed components and elements.
Semantic tags and attributes are styled contextually out of the box without classes, forcing best practices, and reducing markup class pollution. A few dynamic components are WebComponents and use minimal JavaScript.
Zero dependencies
Fully-standalone with no dependencies on any JS or CSS frameworks or libraries. No Node.js ecosystem garbage or bloat.
Semantic HTML
Native elements like <button>, <input>, <dialog> and
semantic attributes like role="button" are styled directly. No classes.
Accessibility
Semantic HTML and ARIA roles are used (and forced in many places) throughout. Proper keyboard navigation support for all components and elements.
Easy customization
Easily customize the overall theme by overriding a handful of CSS variables. Automically picks up dark theme based on system preferences.
Why?
Oat Glassed is a fork of Oat UI that adds glassmorphism, enhanced theming with CSS light-dark(), and additional components.
Born from frustration with over-engineered bloat, complexity, and dependency-hell of pretty much every Javascript UI library and framework out there.
The goal is a simple, minimal, vanilla, standards-based UI library for the long term without worrying about Javascript ecosystem churn. Long term because it's just simple vanilla CSS and JS. The look and feel are influenced by the shadcn aesthetic with a frosted-glass twist.