№ kononenkogroup-com--work

Part of Kononenko Architectural Bureau - 4 pages captured →

Kononenko Architectural Bureau · Work

Brutalist concrete haze, sharp white sans-serif floating over muted industrial grey

Portfolio Gridminimalism editorial architecturelight

An airy, high-contrast layout utilizing generous white space and a staggered grid of architectural renders. Typography is understated and functional, prioritizing the imagery. · architecture portfolio, minimalist grid, editorial layout, luxury real estate web design, white space gallery

Kononenko Architectural Bureau · Work - mobile — Mobile · 375

Hero - desktop 1440 × 900 · mobile 375

See history ↻Visit source ↗

The whole page, top to bottom - desktop & mobile

Kononenko Architectural Bureau · Work - full page scroll

Kononenko Architectural Bureau · Work - mobile full page

Palette

Click any value to copy. Roles are suggestions, not gospel.

Reads as: monochrome · muted

SwatchHexOKLCHSuggested roleCopy

Hex#ac8a52
OKLCHoklch(65.3% 0.085 79)
RoleDominant
find sites →
Hex#ecd7ba
OKLCHoklch(88.9% 0.045 76)
RoleSurface
find sites →
Hex#5c5c1c
OKLCHoklch(46.1% 0.085 109)
RoleInk
find sites →
Hex#a49454
OKLCHoklch(66.6% 0.086 96)
RoleAccent
find sites →
Hex#cbbb9c
OKLCHoklch(79.7% 0.046 84)
RoleDetail
find sites →

How to build one like this

Read off the live site. Treat it as reference, not a recipe.

Download .md View raw ↗

Type ramp

Role	Family	Size	Weight	Leading	Tracking	Sample
h1	n	14px	400	1	-0.285px	Aa Bb Cc
h2	n	12px	400	1.2	-0.24px	Aa Bb Cc
body	n	12px	400	1.2	-0.24px	Aa Bb Cc
button	n	12px	400	1.2	-0.24px	Aa Bb Cc

Spacing scale

15px

Radius scale

0px

Container

Max content width 1440px

Export

:root {
  --color-dominant: #ac8a52;
  --color-surface: #ecd7ba;
  --color-ink: #5c5c1c;
  --color-accent: #a49454;
  --color-detail: #cbbb9c;
}

/* CSS variables exposed by source */
:root {
  --vhmobilebar: 9px;
}

For your coding agent

Drop-in prompt

Paste this into Claude Code, Cursor, or any chat-based agent. Pairs the captured tokens with a short brief so the model has both the style and the goal in one block.

Build a landing page in the visual style of Kononenko Architectural Bureau · Work.
Reference design system (extracted from the live site):
- Palette: #ac8a52, #ecd7ba, #5c5c1c, #a49454, #cbbb9c
- Typefaces: n
- Macrostructure: Portfolio Grid
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/kononenkogroup-com--work

Sites that feel similar

Same macrostructure, different voice.

Role

Family

Size

Weight

Leading

Tracking

Sample

14px

400

-0.285px

Aa Bb Cc

12px

400

1.2

-0.24px

Aa Bb Cc

body

12px

400

1.2

-0.24px

Aa Bb Cc

button

12px

400

1.2

-0.24px

Aa Bb Cc

:root { --color-dominant: #ac8a52; --color-surface: #ecd7ba; --color-ink: #5c5c1c; --color-accent: #a49454; --color-detail: #cbbb9c; } /* CSS variables exposed by source */ :root { --vhmobilebar: 9px; }

Build a landing page in the visual style of Kononenko Architectural Bureau · Work. Reference design system (extracted from the live site): - Palette: #ac8a52, #ecd7ba, #5c5c1c, #a49454, #cbbb9c - Typefaces: n - Macrostructure: Portfolio Grid Use the dominant colour for surfaces, the accent sparingly, and lean on type weight + scale rather than colour for hierarchy. Full DESIGN.md: https://inspomcp.dev/api/design/kononenkogroup-com--work