Advanced Components

Clipboard

Hello from dryui!

Marquee

dryui — 73 components, zero dependencies, native browser APIs, Svelte 5 runes •

QR Code

Code Block

svelte

1import { Button, Card } from '@dryui/ui';
2
3function App() {
4  let count = $state(0);
5
6  return (
7    <Card.Root>
8      <Card.Content>
9        <Button onclick={() => count++}>
10          Count: {count}
11        </Button>
12      </Card.Content>
13    </Card.Root>
14  );
15}

Markdown Renderer

Hello World

This is a markdown renderer with italic and inline code.

Item one
Item two
Item three

A blockquote with some wisdom.

const greeting = "Hello, dryui!";
console.log(greeting);

Visit dryui docs

VirtualList (10,000 items)

Item #1 This is virtual list item number 1

Item #2 This is virtual list item number 2

Item #3 This is virtual list item number 3

Item #4 This is virtual list item number 4

Item #5 This is virtual list item number 5

Infinite Scroll

Loaded item 1

Loaded item 2

Loaded item 3

Loaded item 4

Loaded item 5

Loaded item 6

Loaded item 7

Loaded item 8

Loaded item 9

Loaded item 10

Loaded item 11

Loaded item 12

Loaded item 13

Loaded item 14

Loaded item 15

Loaded item 16

Loaded item 17

Loaded item 18

Loaded item 19

Loaded item 20

DataGrid


Alice	Engineer	Frontend	$120,000
Bob	Designer	Design	$95,000
Carol	Manager	Engineering	$150,000
Dave	Engineer	Backend	$130,000
Eve	Analyst	Data	$110,000

Drag and Drop

First item

Second item

Third item

Fourth item

Fifth item

Transfer

Rich Text Editor

Tour demonstrates step-by-step guidance