www.hims.com

hims.com
www.hims.com

Wellness/health brand site using warm earth tones and floating product photography to create an aspirational, lifestyle-focused aesthetic around weight loss and body care.

Colors

Industry

Mood

Screen type

Type style

Visual details

How it works

hero:
Headline stacked left-aligned above a 2-column grid of product/lifestyle imagery with rounded corners; small pill-shaped accent button positioned bottom-left of text block.
layout:
Alternating full-width horizontal sections with centered content; 2-3 column grids for product showcases; diagonal offset product placement with shadows creating depth; left-aligned text paired with right-aligned imagery in rhythm down the page.
type:
Large serif headlines (60-80px) in warm cream/white paired with compact sans-serif body copy (14-16px); numerals and stats rendered in matching serif at 48-56px; pill-shaped buttons use sans-serif at 12-14px with generous padding.
colors:
Warm brown (#6B5346 approximate) dominates large background sections as a containing color; peachy/tan tones (#D4A574 approximate) appear as secondary callout backgrounds and accent buttons; white products and typography float against the brown for maximum contrast.
distinctive:
Stacked flat products (dumbbells, bottles, scales) photographed floating in soft-focus warm backdrops, rotated 15-25° off-axis and layered with subtle shadows to create kinetic product hero sections that dominate 40-60% of viewport height.