C
Cloubay
← All samples/Pet · Premium DTC/Nocturne · Premium pet, by the moon
Pet · Premium DTC·2026

Nocturne · Premium pet, by the moon

A premium pet-food store that builds a delivery plan from the pet, not from the SKU — size, age, weight curve, vet notes feed the auto-reorder cadence.

DTC storefrontPet profile builderAuto-reorder engineVet-note sync
Designs / Visuals

V1 · Pet-first storefront

A premium pet-food storefront that opens with a pet profile builder (species · size · age · diet sensitivity) and lets the recommendation engine choose the right bag and the right cadence. The header carries the brand mark, the next-reorder pill, and a tiny zh/en switcher. Below the hero, a horizontal product strip shows the recommended bag + complementary chews. The reorder rhythm card visualizes the auto-ship schedule as a horizontal calendar.

Palette
Slate #11161D · Moonlight #9DB3CC · Sage #8FA08A · Soft cream #E8E4DC
Fonts
DM Serif Display (display) + Inter (body) + JetBrains Mono (SKU/dates) + Noto Serif SC
Architecture
React 18 UMD + Babel standalone · single-file SPA · static MinIO host
For
Premium pet brands in CN tier-1 / tier-2 cities running an auto-ship subscription
Memorable
Pet card animates in as you answer the profile · reorder calendar locks the cadence visually
Preparing preview…
Full flow: home → list → detail → license → checkout → certPop out:V1

Related samples

See more samples →
Nocturne · Premium pet, by the moon · Cloubay