@t_g/default-ui

Default UI

---

Themed Design System for HTML Elements

• Step 1. (Have AI) write HTML

• Step 2. Import package

• Step 3. Get responsive, themed HTML elements by default

---

Supported Themes

Light

Light Sepia

Dark

Dark Sepia

---

How To Use Themes

1. Install and import package into project

npm i @t_g/default-ui

2. Add a button to the document with an aria label of "Toggle theme" to toggle between all themes

<button arial-label="Toggle Theme" />

3. Optionally toggle a subset of themes using data-themes attribute, comma separated

<button aria-label="Toggle Theme" data-toggle="Light Theme,Dark Sepia Theme" />