The social design system
How the brand shows up on social channels. It inherits the identity from the Brand view and adapts it to fixed-canvas, mobile-first surfaces, then layers on the platform specs, the post and event templates, and the compliance rules every post passes before it goes out.
Principles
This view does not redefine the brand; it translates it. Colors, fonts, the mark, and voice are owned by Brand. This view governs how those assets behave on a square post or a vertical story.
| Principle | What it means in practice |
|---|---|
| One brand, every channel. | A post is recognizable before the mark is read: the same palette, the same display type, the same accent. Never introduce a social-only color or typeface. |
| Platform-native, not platform-generic. | Respect each channel's dimensions, safe areas, and reading behavior. A document carousel and a video thumbnail are different crafts; design for where each is seen. |
| Mobile-first legibility. | Most impressions are on a phone. Type, contrast, and the focal point must hold at thumbnail scale before a post is approved at full size. |
| Compliant by default. | Claims, testimonials, and results follow the rules of the brand's field. When in doubt, a post goes to review before it goes out. |
How it's organized
| Group | Covers |
|---|---|
| Foundations | Brand assets on a fixed canvas, and the social voice and tone. |
| Production | How a video goes from brief to published cut, the lab it is drafted in, and the footage library. |
| LinkedIn, YouTube, Shorts | Each platform's specs and templates, and vertical video under platform chrome. |
| Events | Event listing images, event covers, and webinar promo posts and stories in Minimal, Accent, and Bold. |
| Post Templates | Feed, story, and carousel templates per platform, with caption rules. |
| Advertising | Paid social ads and the text around each image. Display and search placements live in Digital DS. |
| Content & Compliance | Content pillars, posting cadence, and the legal and accessibility guardrails. |
Canvases
Every event image, post, and ad is sized from the social group in src/formats.json, and a template is built from the same pieces as Digital DS (src/styles/canvas.css). A story keeps its message out of the bands the platform covers with its own interface; turn on the guides to see them.
| Format | Size | Safe area | File | Max weight | Page | Notes |
|---|---|---|---|---|---|---|
| Eventbrite event image | 2160 × 1080 px | 108 px | JPG or PNG, under 10 MB | Eventbrite, Facebook & Webinars Planned | Listings crop toward the centre; keep the headline in the middle 1600 px. | |
| Facebook event cover | 1920 × 1005 px | 96 px | JPG or PNG | Eventbrite, Facebook & Webinars Planned | ||
| LinkedIn event cover | 1776 × 444 px | 64 px | JPG or PNG | Eventbrite, Facebook & Webinars Planned | ||
| Webinar promo post | 1080 × 1080 px | 64 px | JPG or PNG | Eventbrite, Facebook & Webinars Planned | ||
| Webinar story | 1080 × 1920 px | 64 px | JPG or PNG | Eventbrite, Facebook & Webinars Planned | ||
| Facebook square post | 1080 × 1080 px | 64 px | JPG or PNG | Facebook Planned | ||
| Facebook link or landscape post | 1200 × 630 px | 60 px | JPG or PNG | Facebook Planned | ||
| Facebook story | 1080 × 1920 px | 64 px | JPG or PNG | Facebook Planned | ||
| Instagram square | 1080 × 1080 px | 64 px | JPG | Instagram Planned | ||
| Instagram portrait | 1080 × 1350 px | 64 px | JPG | Instagram Planned | The profile grid crops portrait posts to 3:4; keep copy inside the centred 1012 × 1350. | |
| Instagram story or reel cover | 1080 × 1920 px | 64 px | JPG | Instagram Planned | ||
| Meta feed ad | 1080 × 1080 px | 64 px | JPG or PNG | Paid Social Ads Planned | ||
| Meta feed ad · portrait | 1080 × 1350 px | 64 px | JPG or PNG | Paid Social Ads Planned | ||
| LinkedIn sponsored | 1200 × 627 px | 60 px | JPG or PNG | Paid Social Ads Planned |
One idea per post, said plainly.
One idea, said plainly.