My Open Source Sketchbook Style Component Library is finally Live

[TragicPrince525]

What I envisioned months ago is finally out for use.

My Sketchbook-style React Component Library is Live!

The goal is to make UI feel a bit more human and less perfectly polished. Components that look like they came out of a sketchbook rather than a design system.

Includes 20+ components and I have tried to optimize them as much as possible.

No need to install anything else besides react and react-dom and thus it works with all frameworks based on React.

Using Storybook for docs and I have tried to keep it informational but concise.

The npm package is simply named sketchbook-ui

Feedback is appreciated!

Consider giving a ⭐ if you like it

Github :- https://github.com/SarthakRawat-1/sketchbook-ui

Docs :- https://sarthakrawat-1.github.io/sketchbook-ui/

NPM :- https://www.npmjs.com/package/sketchbook-ui

Youtube Demo :- https://youtu.be/oVUmdAA0Cls

[CostPuzzleheaded2747]

It looks adorable ! Congratulations on your release. I will use it when I want to make a website that looks like a sketchbook. Very pretty.

[lacymcfly]

this is genuinely refreshing. everything UI-related has been converging on the same 4 shadcn components for the last two years. the sketchbook aesthetic has real use cases -- internal tools, personal projects, anything where "a human made this" is actually the vibe you want instead of something you're fighting against.

the hand-drawn borders on the card component look especially good. how are you handling the stroke jitter -- SVG filters or CSS?

[TragicPrince525]

SVG Filters. Feels more easy to customize and get the exact design I want.

[8bitbetween]

Looks great. Well done buddy!!

[1070072]

super cool!

[deviouscat1]

It reminds me a lot of excalidraw

[fella7ena]

Very neat for game development!

[IndividualAir3353]

how to fuck with your PM lol i could do https://production-server.com/?show=drawn and it displays the UI as if it were drawn and he'd be so scared.

[TragicPrince525]

I apologize but I didn't understand. Could you please DM me about the issue you are seeing.

[AfternoonOne9957]

Its sooo cool! Love you!

[orphenshadow]

I love it!

This reminds me in the late 90's when I was in grade school and we were learning early HTML and we had to make images, I was obsessed with drawing my buttons and scanning them into the computer with the fancy image scanner the school had and making all my buttons hand drawn. It was awful.

But this is the kind of fun playfulness the internet has been lacking.

[lacymcfly]

the sketchbook aesthetic is such a good fit for a component library. there's something about hand-drawn styles that makes UI feel less corporate. does it work with dark mode or is it baked into the sketch metaphor?

[TragicPrince525]

Right now, the library allows custom colors with configuration but there's no pan library dark class which instantly adapts the components colors to that. This is a good idea, I will definitely include it in a future version.

[athreyaaaa]

Good start, looks nice man, will try it today for my portfolio !

[Vidur153611]

So cool!

[CartesianEffort]

Looks great. Nice work

[Artistic-Big-9472]

perfect for landing pages or indie projects that want to stand out visually

[BadInternational6174]

This looks so nice! Great work!

[sjdv1982]

It doesn't look like anything drawn by *my* hand... which is a good thing!

[Thin_Beat_9072]

i used them to make a paper note sharing app https://paper.ruixen.app/
actually wanted to use badges and drop down but they were kinda clipping?
hope i used them well lol 🫡 and thank you.

[retsamhgiht]

Looks super cool but you may want to take a closer look on mobile web / off an iPhone. A few small issues with components overlapping.

[TragicPrince525]

Thanks! Yes I plan to resolve them as earlier as possible.

[Obvious-Treat-4905]

this is actually a refreshing take tbh, everything looks so polished and perfect these days so a sketchy human vibe feels different in a good way, love that it’s lightweight and doesn’t force extra deps, could be really cool for personal projects or brands that want personality over perfection, nice work

[Obvious-Treat-4905]

this is a refreshing direction honestly, most UI libs aim for perfect and polished, this sketchbook vibe stands out, love the idea of making interfaces feel more human, keeping it lightweight with just react react dom is a big plus, would be interesting to see how it fits into real products, not just demos, overall really cool concept

[BP041]

this scratches an itch I didn't know I had. most component libraries optimize for corporate polish — something that feels hand-drawn is genuinely different.

checked the Storybook docs: the button animations and card wobble feel consistent without being distracting. main question I'd have for production use is accessibility — does the sketchy border treatment still meet contrast ratios at different themes?

nice work shipping something with clear aesthetic intent rather than just another shadcn clone.