posts.design

Social post design inspiration — posts.designsaved 26d ago · captured 26d ago

Seven details, seven pinned.

View as Markdown ↗

Colors8 colors · ground #F4F5F4

ground#f4f5f4·23.68%#07080a·14.89%#63905f·9.24%#133fec·8.66%#cacfce·7.07%#abada8·6.48%#0b3b1f·5.52%#56504c·3.99%

Sized by coverage · click to copy.

Typography1 family · 2 styles · Inter

Body

See what 620+ brands actually ship to socials

Inter · 14/20 · 400 · normal

Small

Online

Inter · 12/16 · 500 · normal

Specimens are the page's own words at their measured metrics.

ButtonsRecent2 styles

RecentTop launches

primary · fill #ebebeb · label #383838 · radius 8px · border 0px · padding 7.68px 12px · height 47px · type 14px / 500

secondary · fill — · label #525252 · radius 8px · border 0px · padding 7.68px 12px · height 47px · type 14px / 500

Shape5 radii · 240 uses

24px134 uses · 56%

9999px92 uses · 38%

8px11 uses · 5%

16px2 uses · 1%

12px1 use · 0%

Analysisposts.design is a curated masonry feed of the social graphics real companies ship, and the site's own chrome is engineered to disappear behind them.

posts.design is a curated masonry feed of the social graphics real companies ship, and the site's own chrome is engineered to disappear behind them. A Zinc near-white ground (#fafafa) carries a slim left sidebar — a plain wordmark, a live count in muted gray, Inter 14px nav items with thin monoline icons and a single soft tonal highlight on the active row — while the rest of the viewport is a three-column grid of 24px-radius tiles with no borders, no captions and no titles, each stamped only with a small circular brand-logo badge in its corner. The one piece of chrome with personality is the sidebar's subscribe card: a white rounded panel holding three stacked thumbnails, an italic serif tagline ("Best of social, curated") and a pill-shaped near-black button. Everything is neutral on purpose — black, grays and white — so the color comes entirely from the posts.

Style recipeDesign a light-first gallery interface where the interface is silent and the content carries all color.

Design a light-first gallery interface where the interface is silent and the content carries all color. Ground: #fafafa. Cards and panels: #ffffff. Primary action: solid #171717 with #fafafa text, 8px radius on standard buttons and 9999px pill for the hero action, 14px/600 Inter. Type: Inter throughout — 14px/20px regular body, 16px/24px for headings and nav, muted gray (#56504c-ish) for secondary text; permit exactly one italic serif line for a tagline or editorial moment. Layout: a fixed ~270px left sidebar with a stack of icon + label nav rows and a single tonal active state (a slightly darker neutral fill, no accent color, no indicator bar); a masonry grid of media tiles to the right with a consistent 24px radius, generous ~12px gutters, no borders, no shadows, no captions. Attribution lives in a 32px circular badge overlaid in a tile corner. Use hairline separators (#cacfce) sparingly between nav groups. Keep counters as small muted dot-and-number pairs beside labels. Motion: none beyond hover; let images and video autoplay do the work.

Details7 worth noting

posts.design — the captured page — Landing, 1440 × 900 · captured Sep 13, 2026

1Neutral-only interface chrome
Gallery chrome in pure neutrals (#fafafa ground, #171717 buttons, gray text) so every hue on the page belongs to the content, not the interface.
2Borderless 24px tiles
Uniform 24px tile radius with zero borders and zero shadows; the tiles read as pinned cards through radius and the off-white gap alone.
3Circular brand badge as sole attribution
A single circular favicon badge overlaid in each tile's corner as the only attribution — no caption row, no metadata, no hover text.
4Muted dot-and-number entry count
The live entry count ("• 750") sits beside the wordmark as a tiny muted dot-and-number, a quiet proof-of-freshness.
5Tonal fill active nav state
Active nav item marked with a soft tonal fill (a shade darker than the ground), not a color or a bar.
6One italic serif line
One italic serif line inside an otherwise Inter-only page, reserved for the newsletter card, gives the subscribe moment a touch of editorial voice.
7Sidebar filler illustration and value line
Full-height sticky sidebar with a hand-drawn-style monoline icon and a two-line value line ("See what 580+ brands actually ship") filling the empty middle instead of leaving dead space.

editorial-media · landing · light · minimal, bento · calm, confident, elegant, trustworthy

posts.design

More like this