Skip to main content
Looseleaf

Looseleaf

kevintngo.github.io/looseleaf

MIT-licensed React components that look drawn by hand, with the same parts and props as shadcn/ui.

UI & UX DesignDevelopmentOpen Source

About Looseleaf

Looseleaf is Kevin Ngo's React component library, posted November 1, 2026. The site at kevintngo.github.io says it is 123 accessible React components that look drawn by hand, with the same parts and props as shadcn/ui. The README says the registry is kevintngo.github.io, and the install line is npx shadcn@latest add @looseleaf/button.

Components land in the repo as source. The README also counts 61 blocks, Kevin Sans, and a pencil-stub mascot named Stubby. The demo video was made with Benji Taylor's Stageshow skill.

The license file is MIT, copyright 2026 Looseleaf contributors. The README says that license covers the code, the art, and Kevin Sans, and that IBM Plex Mono is SIL Open Font License 1.1. The site and repository do not list a paid plan.

Pricing: Free. The license file is MIT, copyright 2026 Looseleaf contributors. The README says that covers the code, the art, and Kevin Sans, and that IBM Plex Mono is SIL Open Font License 1.1. The site and repository checked on November 1, 2026 do not list a paid plan.

Pricing model: Free

Features

  • 123 accessible React components with shadcn/ui parts and props
  • Install with npx shadcn@latest add @looseleaf/button
  • 61 blocks, Kevin Sans, and the Stubby mascot
  • MIT license for the code, the art, and Kevin Sans
  • Public repository kevintngo/looseleaf
  • shadcn registry of hand-drawn components
  • MIT license
  • Same product as the Looseleaf tool listing
  • README with the registry install
  • Counts for components, blocks, and art
  • MIT license note, plus SIL OFL for IBM Plex Mono

FAQs

Common questions about Looseleaf

What is Looseleaf?
A React library of 123 components that look drawn by hand, with the same parts and props as shadcn/ui. Kevin Ngo posted it on November 1, 2026.
How much does Looseleaf cost?
The license is MIT, copyright 2026 Looseleaf contributors. IBM Plex Mono in the repo is SIL Open Font License 1.1.
How do I install Looseleaf?
The README says to add the @looseleaf registry, then run npx shadcn@latest add @looseleaf/button. The registry URL is https://kevintngo.github.io/looseleaf/r/{name}.json.
What license is Looseleaf under?
MIT, copyright 2026 Looseleaf contributors. The README says that covers the code, the art, and Kevin Sans. IBM Plex Mono is SIL Open Font License 1.1.
Is Looseleaf a mobile app?
No. It is a React component library. The pages checked do not list a store download.
Where is the write-up?
https://kevintngo.github.io/looseleaf/. The README is https://github.com/kevintngo/looseleaf/blob/main/README.md.

Similar products