Social app design
User content leads; the UI is alive but never competes with it.
- Typeface ·
- System humanist sans (SF Pro, Roboto) — fast, familiar
- Hero ·
- title via weight, ~20–28px
- Body ·
- 15–17px
- Numerals ·
- Proportional (counts read inline)
Soft → pill — playful, avatars fully round
Pick one and apply it to every card, button, input, and modal. Mixing sharp and round corners is the #1 tell of un-designed UI.
Energetic, warmer accent — appears for likes, mentions, online dots. Still one accent.
Medium, content-led. Avatars and media drive layout; chrome is minimal.
Names bold, timestamps tiny/tertiary, body readable. Let content lead.
Pulse (alive) for likes (like-burst), live dots (pulse-beat), new content (stagger-cascade).
Feed list, avatar + name + time row, like/comment/share, bottom-sheet composer, story rail.
Avoid in social & community
- heavy chrome over content
- slow feed entrance (kills scroll)
- engagement-bait colors
- inconsistent avatar shapes
Build it with StyleSeed
StyleSeed bakes this judgment into 74 rules your AI reads automatically. For social & community, start from the Arc skin and the pulse motion seed.