Case study · 2025
bydefaulthuman
Scroll
bydefaulthuman
View live site- Year
- 2025
- Type
- UI component Library
- Tech stack
- Next.js 15 | TypeScript | Rough.js | Tailwind CSS v4 | shadcn/ui | Fumadocs | Framer Motion | D3
- Status
- Featured project
React UI that looks hand-drawn.
Wobbly, sketchy components built on Rough.js with pencil, ink, and crayon themes — install with one shadcn-style command, own the source, and customise everything while staying fully accessible under the hood. Every border and shape is generated at runtime, so there are no PNGs, SVG assets, or icon fonts to manage, and paths animate themselves into view on first render.
Scope & impact
- 35+ accessible, keyboard-navigable components with a shadcn-style one-command install.
- Three switchable themes — Pencil, Ink, and Crayon — set globally or per-component via a single prop.
- Rough.js SVG overlay redraws with a new random seed on hover, giving components a subtle hand-drawn 'alive' feel.