MZONE-UI · VERSION 1.3.0 · PLAYGROUND

mzone-ui 1.3.0

28 Module, 75 Klassen, keine externe Abhaengigkeit. Jeder Effekt unten ist echt und laeuft in dieser Seite — der Theme-Schalter oben rechts ist mz-theme-toggle in Betrieb.

Quelle
/lib/mzone-ui@1.3.0/ — serverseitig gepinnt, offline nutzbar
Vorbild
canvas-ui (MIT + Commons Clause) — Verhalten nachgebaut, kein Fremdcode uebernommen
Barrierefreiheit
Jedes Modul liest prefers-reduced-motion live und reagiert im Betrieb

Einbinden

Ein <link> fuer das Vokabular, ein Modul-Import je Effekt. Nichts wird gebuendelt, nichts kommt von einem CDN.

<link rel="stylesheet" href="/lib/mzone-ui@1.3.0/mzone.css">
<body class="mz-body">
  <main class="mz-page"> … </main>
  <script type="module">
    import { ripple } from '/lib/mzone-ui@1.3.0/fx-ripple.js';
    ripple('.mz-hero', { renderer: 'auto', ambient: 4 });
  </script>
</body>

Module

Klassen

Direkt aus mzone-ui.catalog.json gelesen — was hier steht, liefert der Server auch aus.

Farben