v1.0.0 released

Sharp. Minimal. Semantic.

Barley UI is a zero-dependency, semantic CSS/JS library for building modern web interfaces. Extremely lightweight. Load it and forget it.

Get Started View Components

⚡ Zero Dependencies

Pure CSS and Vanilla JS. No build steps, no complex frameworks, no npm install required. Just drop it in.

💎 Semantic

Styles native HTML elements directly. Accessible by default. We use <details>, <dialog>, and <progress>.

ðŸŠķ ~8KB

Extremely lightweight. Designed for speed and performance. Perfect for static sites, prototypes, and minimalist apps.

Components

A tour of the built-in styles and web components.

Buttons

Badges

New Active Pending Error Outline

Forms

Accordion

What is Barley?

Barley is a lightweight UI kit that focuses on semantic HTML and minimal class usage.

Is it free?

Yes, it is open source and free to use for personal and commercial projects.

Tabs (Web Component)

Account details go here.

Feedback

Dropdown

Loading

Get Started

Simply include the CSS and JS files in your project. No build step required.

<link rel="stylesheet" href="barley.css">
<script src="barley.js" defer></script>