<semtic-article title="Hello world">
<p>Clean authoring. Real HTML output.</p>
</semtic-article>
Skirbi is web author system system for building web interfaces using semantic HTML, CSS tokens, and light DOM web components.
Each layer has one job.
Becomes:
<semtic-article>
<article>
<semtic-header>
<header>
<h1>Hello world</h1>
</header>
</semtic-header>
<section>
<p>Clean authoring. Real HTML output.</p>
</section>
</article>
</semtic-article>
No Shadow DOM. No class soup. Everything inspectable.
The layers
| Layer | Package | Responsibility |
|---|---|---|
| Base | @skirbi/sugar |
Web Component primitives |
| Structure | @skirbi/semtic |
Semantic HTML components |
| Styling | @skirbi/pinta |
Tokens + visual primitives |
| Composition | @skirbi/dibuho |
UI patterns / layouts |
Each layer depends only on what’s below it. Use as much or as little as you need.
Pick your entry point
I want to write content and build pages → start with Semtic
I want to theme and style things → start with Pinta
I want ready-made page sections → start with Dibuho
I want to build my own components → start with Sugar
I want to use it for my site! → see Integrations