Sazami

A zero-dependency UI engine for the web. Write concise Sakko markup, get real web components with automatic theming and directional corner rounding.

Quick start

import { compileSakko, injectThemeCSS } from "@nisoku/sazami";

injectThemeCSS();

compileSakko(`
  <card {
    heading: "Hello, world"
    text: "Built with Sazami"
    button(accent): "Get Started"
  }>
`, document.getElementById("app"));

That renders a styled card with a heading, paragraph, and themed button into the DOM. No HTML templates, no CSS classes, no framework boilerplate.

What you get

Feature Details
Components 48 semantic web components with Shadow DOM, ARIA roles, keyboard navigation
Icons 41 SVG icons built in, no external dependencies
Tokens Design token system: colors, spacing, typography, radii, shadows
Curvomorphism Directional corner rounding based on element position
Signal Integration Reactive state binding with Sairin signals
Output ESM + CJS builds with full TypeScript declarations
Dependencies Zero. The entire library ships as a single bundle.

Documentation

Page Description
Primitives All 48 web components with usage examples
Config & Theming Design tokens, custom themes, CSS variable generation
Curvomorphism How directional corner rounding works
API Reference Complete public API: functions, types, exports, Sairin signal integration
  • Sairin Docs - Reactive state management with signals, derived values, effects, and resources
  • Sakko Docs - DSL syntax for writing component markup
NextPrimitives