# emilkowal.ski

Source: https://emilkowal.ski/
Captured: 2026-09-20
Tags: portfolio, landing, light, both, minimal, editorial, calm, confident, elegant, human
Colors: #fdfdfc, #d0d0ce, #b6b6b4, #9d9c9a
Type (body): Sans · 14px/23.1px · 400 — "My new course called aiforui.dev is in early access! Early access has closed."
Type (button): Sans · 16px/24px · 500 — "Subscribe"
Button: "Subscribe" — fill #21201c, text #fdfdfc, radius 9999px, border 0px, padding 0px 14px, height 38px, type 16px/500
Radii: 6px (14), 8px (1), 9999px (1)

## Images

- Hero (desktop): https://media.lvly.design/library/emilkowal-ski/hero.webp?v=4c5ac5fb
- Page crop (mid-1): https://media.lvly.design/library/emilkowal-ski/mid-1.webp?v=1dcb889b
- Page crop (mid-2): https://media.lvly.design/library/emilkowal-ski/mid-2.webp?v=4d9cfc8e
- Hero (mobile): https://media.lvly.design/library/emilkowal-ski/mobile-hero.webp?v=1d60fe23
- Full page (desktop): https://media.lvly.design/library/emilkowal-ski/full.jpg?v=4f1408f1
- Full page (mobile): https://media.lvly.design/library/emilkowal-ski/mobile-full.jpg?v=5f556e76
- Clip preview (mp4): https://media.lvly.design/library/emilkowal-ski/video-4j5eiv.preview.mp4?v=8ae1a55b

A personal site that has been reduced until only the reading remains. One ~630px column sits centered on a warm off-white ground (#fdfdfc at 98% of the page), everything inside it left-aligned, and the entire document is set at a single size — 14px/400 with a generous 23.1px line-height — so hierarchy has to be carried by color and vertical air alone. There is no nav, no logo, no hero image, no card, no divider and no border anywhere until the newsletter field at the very bottom; the masthead is literally the name in near-black over the role in gray. Sections ("Today", "Projects", "Writing", "Newsletter", "More") are announced by a single ink-colored word with roughly 70px of emptiness above it, and their contents are two-line rows: a title in ink, a one-sentence description in gray, repeated at an even rhythm. The confidence is in the restraint — the work is a list of names you are expected to recognize, and the only piece of chrome on the page, the pill-in-pill subscribe field, reads as a deliberate exception rather than a style.

## Steal-worthy details

- One measure, centered, left-aligned inside — a ~630px column on a 1440px viewport, so the text block reads as a page rather than a layout, and the whitespace is all margin rather than gutter
- One type size for the whole document — 14px/400 at 23.1px line-height for headings, section labels, titles and body alike; the only exception on the page is the 16px/500 button label. Hierarchy comes from color and space, never from scale
- The masthead is two lines of body text — name in ink, role in gray, no bar, no logo, no navigation, nothing sticky. The page starts ~130px down with an ordinary paragraph that happens to be your name
- Section labels are the same size as body copy and are separated only by weight and by ~70px of air above them; drop the rule, drop the uppercase tracking, and let the emptiness do the announcing
- Two-line list rows as the universal content unit — ink title, gray one-sentence description directly beneath, ~64px between rows and no bullet, number, date, tag or thumbnail. Projects and writing use the identical row, so the page has exactly one list pattern
- Warm neutrals instead of pure black and white — the ground is #fdfdfc rather than #fff, the ink #21201c rather than #000, and the hairlines step down through #d0d0ce and #b6b6b4; nothing on the page is fully saturated
- The newsletter field is a pill inside a pill — a 9999px white capsule with a hairline and a soft shadow, holding a 38px solid #21201c pill button flush to its right inset, label 16px/500 in #fdfdfc. It is the only filled, rounded, shadowed object on the page and so it reads as the one call to action without any color
- The page closes on a sentence, not a footer — one line of prose with the social destinations as inline underlined text links rather than an icon row

## Style recipe

Build the whole page as a single left-aligned column about 620–640px wide, centered in the viewport, with ~130px of air above the first line and nothing in the margins — no sidebar, no nav bar, no sticky header, no hero image.

Set one type size and keep it: 14px / weight 400 / line-height 1.65 (≈23px) / letter-spacing normal, in a neutral grotesk (Inter, Söhne or the system sans). Do not introduce an h1 scale. Express hierarchy with exactly three moves: ink #21201c for anything that functions as a heading or a title, a warm gray at roughly 55–60% of the ink for every supporting line, and vertical space — ~70px above a section label, ~24px between a label and its first row, ~64px between rows within a section, ~110px between sections.

Ground everything on warm off-white #fdfdfc; never pure white and never pure black. Reserve borders for a single element: the subscribe field. Step any hairline you do need through #d0d0ce, with #b6b6b4 and #9d9c9a as the darker rungs. Use no cards, no dividers, no background tints, no section stripes.

Structure every list — work, writing, links, anything — as the same two-line row: title in ink on line one, a single plain-English sentence in gray on line two, ending with a period. No dates, no tags, no counts, no arrows, no thumbnails. One list pattern for the entire page.

Radii: 6px on interactive hit areas (link hover grounds, focus rings), and 9999px on the one form. Build that form as a pill inside a pill — an outer white capsule with a #d0d0ce hairline and a low, wide, barely visible shadow, containing a borderless input at 14px and, inset flush right, a 38px-tall solid #21201c button with #fdfdfc label at 16px/500 and 14px horizontal padding.

Motion is subtle and short: 120–200ms ease-out on link hover (an underline appearing, or a 6px tinted ground fading in) and on the button's press state. Nothing animates on scroll and nothing animates on load. Close the page with one sentence of prose carrying inline underlined links rather than a footer bar or icon row.

The two moves that make this recognizable: one type size for the whole document, and a page where the only object with a fill, a border, a radius and a shadow is the single thing you want clicked.