sohna.dev

A one-screen studio page that fits its entire pitch above the fold: a small clover-mark wordmark, a two-line Inter headline at 76px/700 with −3px tracking, and a row of three identical product cards on a barely-there off-white ground. The palette is deliberately empty — near-white, mid grays and near-black — so the only color on the page comes from three glossy 3D app icons (a yellow watermelon slice, an orange motion ribbon, a blue glass cube) that behave like Apple app icons on a shelf. Everything else is restraint: 24px card radius, 14px pill-ish black buttons, one weight of gray body text, and a footer that is just a copyright line. It reads as a design-engineer's calling card — precise type, generous whitespace, and toy-like illustration doing all the personality work.

Build a light, one-typeface, single-screen page. Use Inter for everything: display at 72–80px / weight 700 / letter-spacing −3px / line-height ~1.2; body at 18px / 400 / line-height 24px, color #303030; card titles 22–24px / 700 near-black #0c0c0c. Page ground #fdfdfd; surfaces one step darker (#f6f6f6–#f7f7f7) with 24px radius, no border, no shadow. Keep the palette achromatic — the only saturated color lives in illustration or icons, ideally rendered 3D objects with soft top lighting on a transparent ground, sized ~110–120px and left-aligned in their card. Primary buttons are solid #020202 with #fbfbfb text, 14px radius, 16px 24px padding, 18px/700 labels, ~56px tall; use one style everywhere and never a secondary variant. Layout: a 1140px content column with a small wordmark top-left, headline occupying ~40% of the viewport, then an equal-width 3-up grid with ~32px gutters, then a single-line footer. Strip navigation entirely if the page has fewer than four destinations. Use a ghosted gray logo glyph as an inline ornament at the end of a headline. Prefer everything above the fold over any scrolling narrative.