# Tailwind Tree
> Style a Svelte JSON viewer with Tailwind utilities: rounded rows, colorful values, three palettes, and keyboard navigation.
**Source:** [https://jsonview.svelte.page/examples/tailwind](https://jsonview.svelte.page/examples/tailwind)
**Markdown mirror:** [https://jsonview.svelte.page/examples/tailwind.md](https://jsonview.svelte.page/examples/tailwind.md)
---
This mirror preserves the prose, implementation notes, and runnable Svelte source behind the live example page.
## FIG-001: tailwind tree.
A little polish goes a long way. Rounded rows, vivid values, and a palette that makes structured data feel at home in your app.
**Metadata:** tag: `THEMING` | style: `tailwind + css` | palettes: `3`
### Source
#### TailwindTree.svelte
Source file: [src/lib/examples/tailwind/demos/TailwindTree.svelte](https://github.com/humanspeak/svelte-json-view-lite/blob/main/docs/src/lib/examples/tailwind/demos/TailwindTree.svelte)
```svelte
{'{ }'}
A DIFFERENT POINT OF VIEW
Your data. Dressed up.
{#each ['dusk', 'ocean', 'daylight'] as name (name)}
{/each}