Interfaces made of glass that feel
at home on every screen.
One stylesheet. Ship.
Copy css/ and js/ into your project and link
them. The script is optional sugar — toasts, tabs, ⌘K — everything
else is pure CSS on semantic HTML. In React, install the package
instead: same markup, typed.
<link rel="stylesheet" href="css/barua.css">
<script defer src="js/barua.js"></script>
<button class="b-btn b-btn--primary">Habari, Barua!</button>npm install barua-uiimport "barua-ui/css";
import { Button } from "barua-ui";
<Button variant="primary">Habari, Barua!</Button>
Theming is one attribute: data-theme="dark" on
<html>, or leave it to the system. Re-tint the
whole app with data-accent="purple".
Premium by restraint.
Apple DNA, web native
HIG type scale, system palette, spring motion — rebuilt on modern CSS: light-dark(), layers, popover, dialog.
Real glass, everywhere
Five materials from ultra-thin to chrome, each with a specular edge and saturated blur. Bars, sheets, menus and docks let the content glow through.
Tokens first
Every color, radius and shadow is a --b-* token. One data-accent attribute re-tints the entire system.