Doodle UI

shadcn/ui,
but hand-drawn.

Doodle UI is a childish, sketchy theme for shadcn/ui — wobbly blob corners, the Neucha and Cabin Sketch fonts, and full light + dark support. Every component, restyled.

$npx shadcn@latest add @doodle-ui/button

Browse components

The whole crayon box

Every shadcn/ui primitive, wearing wobbly corners. Toggle dark mode up top — the doodle look holds in both.

Buttons

Badge

NewSecondaryOutlineOops

Forms

Name

Message

I like crayons

Wobble mode

Pick a snack

Option A

Option B

Volume

Feedback

All doodled up

Your components now have hand-drawn corners.

Progress

Doodle User

Blobby by default

Surfaces

Card title

Cards get the roomiest blob corners.

Compose headers, content, and footers — all hand-drawn.

The first tab.

Chat

MessageScroller, Message, Bubble, Attachment, and Marker — the conversation layer, wearing wobbly corners.

Today

Doodle Bot

Hey! Want to see a hand-drawn chat bubble?

just now

Absolutely — squiggles or it didn't happen.

Here's a scribble sketch you can attach to any thread.

scribble-notes.pdf128 KB

Streaming a doodle reply…

Blob radii on bubbles, chalk outlines on attachments, and Cabin Sketch nearby. Chat, but childish.