HEARTWOOD Landing page & brand direction
Keshav Sharma
HEARTWOOD
Landing page & brand direction for a slow-living botanical skincare line
Heartwood makes skincare for older skin, so the whole thing had to feel unhurried and kind rather than clinical. I brainstormed and wireframed the structure in Figma, building it on a wabi-sabi palette — warm bone (#F5EFE6), deep walnut (#5C4033), and a muted wood taupe (#655C55) for the accents — with Fraunces carrying the calm headlines and Inter handling the body. There's no pure black or white anywhere; every tone sits a few degrees warmer.
Because the audience skews older, accessibility drove the calls: body text never drops below 16px, tap targets stay generous, and every pairing is contrast-checked to WCAG AA. Motion is limited to slow fade-ins — nothing that startles.
The wood-grain heart logo and product imagery were generated and cleaned up in ChatGPT, the hero clip came out of Veo, and I built the final responsive site in Framer — with Claude as a design-and-build partner throughout.
Tools: Figma (wireframing & design) · Framer (build) · Claude · ChatGPT (imagery) · Veo (video)
Like this project
Posted Jul 17, 2026
HEARTWOOD Landing page & brand direction for a slow-living botanical skincare line Heartwood makes skincare for older skin, so the whole thing had to feel un...
