# Looseleaf draws 123 shadcn/ui components by hand

By Steven Van · 2026-11-01

The library is MIT licensed and keeps shadcn/ui parts and props, though IBM Plex Mono in the repo stays under a separate font license.

Kevin Ngo posted [Looseleaf](<https://creatorstoolbox.com/tools/looseleaf>) on November 1, 2026, a React library of 123 components that look drawn by hand. It keeps the same parts and props as shadcn/ui, so existing JSX can stay. He made the demo video with Benji Taylor's [Stageshow](<https://creatorstoolbox.com/tools/stageshow>) skill, which scripts a cursor through the real components.

[View media](<https://creatorstoolbox.com/images/blog-media/looseleaf-hand-drawn-components-official.mp4>)

Official Looseleaf image.

Add the registry once, then install a piece with npx shadcn@latest add @looseleaf/button. Components land in the repo as source, not as a package dependency. The README counts 61 blocks, a hand-drawn typeface called Kevin Sans, and a pencil-stub mascot named Stubby. The license is MIT for the code, the art, and Kevin Sans. IBM Plex Mono in the repo is under the SIL Open Font License 1.1. The site and repository do not list a paid plan.

Sources

[Kevin Ngo's announcement](<https://x.com/kevin_t_ngo/status/2116743334735851819>), [his follow-up with the site](<https://x.com/kevin_t_ngo/status/2116761857193381920>), [the Looseleaf site](<https://kevintngo.github.io/looseleaf/>), and [the repository](<https://github.com/kevintngo/looseleaf>).

[Read Looseleaf draws 123 shadcn/ui components by hand on Creators Toolbox](<https://creatorstoolbox.com/blog/looseleaf-hand-drawn-shadcn-ui-components>)

---
Canonical source: https://creatorstoolbox.com/blog/looseleaf-hand-drawn-shadcn-ui-components