HanubeesStart a project

Hanubees Design Library

See the design. Feel the motion. Take it apart.

Complete themes and focused UI sections rebuilt as real, responsive websites. Preview every interaction, inspect the decisions, then download the code or the editable package.

12working builds
02live themes
3-in-1preview, code, theme

Interaction study / live

Live
Edition 04New forms for quieter rooms.
No screenshots. Try the controls.

Full-site theme collection

Not a still image. The whole site, alive.

Each release includes a browser preview, the source behind that preview, an editable theme folder, and a compact project abstract.

Theme 02 / Unruled

Live
Live browser build

Theme 02Fashion theme / Next.js · React · CSS

Unruled

Kinetic monochrome streetwear storefront

A cinematic, image-led storefront for independent fashion labels: oversized kinetic type, a four-piece drop, product quick-view, editorial story blocks, and motion that remains smooth and accessible across screen sizes.

Campaign ticker + mastheadKinetic image heroLimited-drop product railInteractive product drawerMotion-safe marquee
Preview + downloadFull-screen preview

Theme 01 / Kart

Live
Live browser build

Theme 01Commerce theme / Next.js · React · Plain CSS

Kart

High-density marketplace storefront

A full fashion-marketplace homepage built the way high-volume Indian retail actually works: promo bars, a peeking campaign carousel, dense product rails, and category tiles that keep merchandising in charge.

Utility + sticky mastheadPeeking hero carouselPromo code strip
Open live themeFull-screen preview

Collection 001 · Live now

Liquid Glass
for Shopify

Ten high-utility storefront components that use translucency, depth, and motion without making the shopping experience harder.

Open all 10 builds
01Product cardEasy · 15 min02Floating navigationIntermediate · 25 min03Cart drawerIntermediate · 30 min04Mobile menuEasy · 20 min05Search overlayIntermediate · 30 min06Product galleryIntermediate · 35 min07Featured collectionEasy · 25 min08Announcement barEasy · 10 min09Quick viewIntermediate · 35 min10Testimonial cardEasy · 15 min

The library rule

Save the effect. Learn the decision.

Every entry has to earn its page with a live build, a specific use case, implementation guidance, and code you can inspect.

01

Curated signal

A visual direction that is actively being saved, shared, or discussed.

02

Original rebuild

Our own markup, behavior, and art direction—not copied repository code.

03

Real placement

A direct answer to where the idea belongs in Shopify or a modern site.

04

One canonical page

No SEO clones. One strong URL that can accumulate links, updates, and trust.

Next on the shelf

Four directions, forty-four useful reasons to return.

These are the next collections in the publishing system. They stay broad enough to grow and narrow enough to own a recognizable idea.

02 / Upcoming

Kinetic type

Text reveals, elastic headlines, marquees, and scroll-led editorial motion.

12 planned
03 / Upcoming

Image transitions

Product reveals, clip-path galleries, direction-aware hovers, and page transitions.

10 planned
04 / Upcoming

Conversion motion

Carts, quick adds, variant pickers, and micro-interactions built to stay useful.

14 planned
05 / Upcoming

Spatial commerce

Layered product scenes, depth, 3D-feeling layouts, and immersive storytelling.

8 planned