01
Facet-first browsing
Every filter maps to structured sample fields — finish, undertone, skin-type tag and benefit label. The model is reusable; the displayed product details remain illustrative.
About
Made to be
worn.
TINT is a fictional makeup-store theme for face, eyes, lips, cheek and brows. It demonstrates browsing by finish, undertone, skin-type tag and benefit label using illustrative records that a real merchant must replace and substantiate.
02
Claims kept in bounds
Formula, ingredient and shade details demonstrate content structure only. A real merchant must replace them with tested, substantiated product information before launch.
03
Honest by default
The cart total is real local math, while the confirmation says plainly that no payment, email or fulfilment occurs. It is a front-end demonstration, clearly labelled.
How it's made
Every product photo on this site is real, self-hosted photography — downloaded once, converted to webp, and committed to the repo. No hotlinking, no external requests at runtime, and every image ships with its true dimensions so the layout never shifts while it loads.
The storefront runs entirely in your browser: no backend, no API calls. Adding to cart and placing an order update local state directly, persisted to this browser's localStorage — instant, and honestly labelled as a demo. Nothing is ever charged and no order is transmitted anywhere.
The filter engine
Every field below is declared once, in one data file, and the shop keeps working:
category
Category
Face · Eyes · Lips · Cheek · Brows
finish
Finish
Matte · Satin · Dewy · Shimmer
undertone
Undertone
Warm · Cool · Neutral
skinType
Skin type
Dry · Oily · Combination · All
benefit
Benefit
Longwear · Hydrating · Clean · SPF