{ "schema": "brand-kit@2", "palette": { "paper": "#FFFFFF", "surface": "#F5F5F2", "ink": "#11110D", "ink_muted": "#5D5D59", "accent": "#D1F470", "on_accent": "#11110D", "accent_secondary": "#203524", "night": "#11110D", "on_night": "#FFFFFF", "extras": [ { "name": "Coconut", "hex": "#FFFFFF", "role": "Core. The brand canvas and primary background on every touchpoint", "cmyk": "0, 0, 0, 0", "pms": "N/A", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "page ground, nav ground (90% opaque), white cards, input fill (observed 2026-10-31)" }, { "name": "Licorice", "hex": "#11110D", "role": "Core. Contrast and legibility: all text on light grounds, dark grounds, the logo colour", "cmyk": "32, 33, 72, 98", "pms": "Black 6C coated; CMYK uncoated", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "all text on light grounds, announcement bar, hero ground under the photo, footer ground, chat launcher (observed 2026-10-31)" }, { "name": "Matcha", "hex": "#D1F470", "role": "Accent. Bright green tribute to the original Zendesk green and a symbol of resolution; use intentionally", "cmyk": "21, 0, 58, 0", "pms": "2297U / 2298C", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "every primary button fill (Licorice text), NEW/FEATURED chips, the event eyebrow, the footer \"Contact us.\" link (observed 2026-10-31)" }, { "name": "Fern", "hex": "#203524", "role": "Secondary. Deep green shift from black for hierarchy", "cmyk": "36, 2, 48, 89", "pms": "5535U / 5605C", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "full-bleed dark green bands (Gartner report, final CTA, FAQ), the event card and the Open Service Directory card (observed 2026-10-31)" }, { "name": "Shamrock", "hex": "#2D4C33", "role": "Secondary. Mid green, a step lighter than Fern", "cmyk": "57, 17, 61, 69", "pms": "3435U / 3435C", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "upper panel of the event card and the countdown tile fill (observed 2026-10-31)" }, { "name": "Cactus", "hex": "#A1D78F", "role": "Secondary. Soft green", "cmyk": "38, 0, 57, 0", "pms": "358U / 358C", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "not used as a CSS colour on the homepage (observed 2026-10-31)" }, { "name": "Pineapple", "hex": "#FEEB7E", "role": "Secondary. Soft yellow", "cmyk": "1, 4, 60, 0", "pms": "100U / 100C", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "not used as a CSS colour on the homepage; appears inside product imagery highlights (observed 2026-10-31)" }, { "name": "Sesame", "hex": "#F5F5F2", "role": "Secondary. Warm off-white, the subtle shift from Coconut", "cmyk": "2, 1, 4, 1", "pms": "CMYK", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "site_use": "card fills (product cards, testimonial card, resource cards, pricing card) and every headline on dark grounds (observed 2026-10-31)" }, { "name": "Stat green", "hex": "#70A32A", "role": "Observed only: big stat numbers and the one highlighted word in a section headline", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "\"smarter\" in the platform headline; 22K+ / 830M / 4.8B stat numbers. Not a published palette colour" }, { "name": "Glow green", "hex": "#355E34", "role": "Observed only: the inner stop of the dark platform panel radial gradient", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "radial-gradient(at 50% 85%, #355E34 25%, #11110D 100%) on the \"Designed for AI-first customer service\" panel" }, { "name": "Field ring", "hex": "#D5D5D2", "role": "Observed only: input ring and FAQ row dividers", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "email input inset 1px ring; FAQ accordion dividers" }, { "name": "Connector grey", "hex": "#D7D7D7", "role": "Observed only: the 2px vertical connector line through the three timeline cards", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "rendered colour of the connector line (screenshot pixel)" }, { "name": "Footer hairline", "hex": "#42433E", "role": "Observed only: the two 1px rules in the Licorice footer", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "rendered colour of the footer rules (screenshot pixel)" }, { "name": "Control grey", "hex": "#EAEAE7", "role": "Observed only: rendered fill of the testimonial carousel arrow circles on Sesame", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "screenshot pixel of the 56px prev/next circles" }, { "name": "Logo tint", "hex": "#5D5D59", "role": "Observed only: the secondary tint Zendesk passes to its customer-logo renderer; our muted ink", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site_use": "parameter $secondary on every customer logo URL" } ] }, "typography": { "display": { "family": "Figtree", "weight": 560, "line_height": 1.05, "tracking": 0, "fallback_stack": "Figtree, \"Helvetica Neue\", Arial, sans-serif", "real": "Vanilla Sans (Zendesk proprietary; weight 500 for all headlines)", "stand_in": true, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site": { "weight": "500 (Figtree 560)", "size_px": "68 hero / 43 phone; 42 section H2 / 30 phone; 26 card titles / 22 phone; 72 stats / 56 phone", "line_height": "1.05 at 68 (71.4px), 1.15 at 42 (48.3px), 1.25 at 26 (32.5px), 1.0 on stats", "tracking": "normal (0) on all headlines", "case": "sentence case, period at the end of full-sentence headlines", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } }, "body": { "family": "Figtree", "weight": 460, "line_height": 1.45, "tracking": 0, "scale": 1, "fallback_stack": "Figtree, \"Helvetica Neue\", Arial, sans-serif", "real": "Vanilla Sans (400 body, 600 buttons/nav/card titles, 700 eyebrows)", "stand_in": true, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "site": { "weights": "400 body (Figtree 460), 600 buttons, nav links, quote and card titles (Figtree 640), 700 eyebrows (Figtree 780), 300 countdown digits", "sizes_px": "18 buttons, 16 body and nav, 14 utility/announcement/footer links and eyebrows; phone 15 body, 13 announcement, 12 eyebrows", "line_height": "1.45 (23.2px at 16; 21.75 at 15), 1.4 at 14 (19.6px), footer links 21px", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } }, "calibration": "Zendesk sets everything in Vanilla Sans, a proprietary face served from its own CDN (observed on zendesk.com 2026-10-31); the brand page does not name or publish its typeface. Stand-in chosen by rendering the same lines in Vanilla Sans on zendesk.com and in 27 Google Fonts candidates (same browser, same size, canvas measureText width and summed alpha ink per px). Figtree matched best on letterforms (double-storey a, single-storey g, round geometric bowls) and line width: hero line \"Automate up to 80% of interactions with\" at 68px: Figtree -0.8% width at 500, -0.1% at 575; body line at 16px: 0.0% at 400; button \"Request Forethought demo\" at 18px: -2.0% at 650; eyebrow at 14px uppercase: +2.0% at 700. Figtree draws lighter at the same nominal weight (ink -9% hero, -15% body), so weights are mapped up: Vanilla Sans 500 -> Figtree 560, 400 -> 460, 600 -> 640, 700 -> 780, 300 -> 300. With this map ink is within about 5% and width within 2.5% on every role. Eyebrow tracking drops from 0.75px to 0.5px to absorb Figtree's +2% uppercase width. Host Grotesk scored equal on width but reads wider-spaced and lighter; Geist matched ink but ran 1.5-5% wide." }, "style": { "button_shape": "rounded", "button_note": "Observed: 16px radius on 48px (43px nav) buttons, Matcha primary and 1px-ring ghost secondary; Garden (product) says one primary per view, primary last in a group, verbs in sentence case", "corners": "40px on content cards, 32px hero, 16px small cards and thumbnails, 12px inputs, 8px countdown tiles, 4px chips", "linework": "no shadows on marketing cards; 1px hairlines only", "motion": "0.6s cubic-bezier(0.7, 0, 0.3, 1) colour fades and underline sweeps", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "voice": { "tone": [ "Confident", "Included", "Credible" ], "notes": [ "The brand page: write how we want people to feel, confident, included and credible; keep it brief, focused and human (paraphrase).", "Brand attributes shown on the voice card: approachable, modern, trusted, connected and fresh.", "Copy expresses what it feels like to use the product.", "Homepage voice (observed): short declarative headlines with a number where one exists (\"Automate up to 80%...\"), sentence case, a full stop at the end of sentence headlines, outcomes over features (\"Faster resolutions. Stronger loyalty. Better outcomes.\").", "Product UI copy follows Garden: button labels are verbs, one action per button, sentence case; the full content guide moved to an internal space." ], "rules": [ { "id": "headline-case", "kind": "headline_case", "value": "sentence", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "brief", "kind": "guidance", "text": "Keep it brief, keep it focused, keep it human", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" }, { "id": "feel", "kind": "guidance", "text": "Write for how the reader should feel: confident, included, credible", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" }, { "id": "verb-labels", "kind": "guidance", "text": "Button labels are verbs and name a single action", "prov": "published", "source": "https://garden.zendesk.com/patterns/buttons/" }, { "id": "button-case", "kind": "guidance", "text": "Button labels in sentence case", "prov": "published", "source": "https://garden.zendesk.com/patterns/buttons/" }, { "id": "trademark", "kind": "guidance", "text": "Mark Zendesk with the registered sign (Zendesk®) at its first mention in campaign copy", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/ (Protect our trademark image)" }, { "id": "numbers", "kind": "guidance", "text": "Lead with a concrete number when Zendesk publishes one (80%, 4.8B+, 22,000+); never invent one", "prov": "inferred", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "period-headlines", "kind": "guidance", "text": "Full-sentence headlines end with a full stop; short labels and titles do not", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "exclaim", "kind": "exclamations", "value": "never", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "spelling", "kind": "spelling", "value": "en-US", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "person", "kind": "person", "value": "we_you", "prov": "observed", "source": "https://www.zendesk.com/company/" } ], "approved": { "words": [ "resolution", "resolve", "AI agents", "service", "connection", "human" ] }, "banned": [], "is_not": [ "cold or technical", "loud or hyped", "long-winded" ], "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" }, "spec": { "source": "https://www.zendesk.com/company/brand-guidelines/", "how": "Zendesk's public brand resources page and its embedded images, the Garden design system (garden.zendesk.com) for product UI rules, and measurements of the homepage (www.zendesk.com) at 1440 and 390, 2026-10-31", "provenance": "published", "motion": [ { "name": "standard", "easing": "cubic-bezier(0.7, 0, 0.3, 1)", "duration_ms": 600, "use": "button and link colour fades and the underline sweep on hover (observed computed transition on every CTA)", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "overlay", "easing": "linear", "duration_ms": 100, "use": "button ::before fill and border on hover", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "baseline-animation-kit", "use": "Video and motion work starts from Zendesk's Baseline Animation Kit (a Google Slides link on the brand page); its contents are not public", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" } ], "icons": { "grid": "grid-based (size not published)", "stroke": "not published for brand icons; Garden product icons are stroke by default, fill for selected states", "sizes": [ { "name": "product-default", "px": 16, "use": "Garden default UI icon" }, { "name": "product-compact", "px": 12, "use": "Garden compact spaces" }, { "name": "product-illustration", "px": 32, "use": "Garden: scaled 16px icons for illustration only" } ], "rule": "Brand icons build from the primary logo's geometry: geometric shapes with rounded and sharp edges, simple, universally recognisable, fresh metaphors", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "also": [ "https://garden.zendesk.com/design/icons/" ] }, "signature": [ { "id": "matcha-cta", "name": "Matcha on Licorice", "where": "every primary call to action, chips and the one accent link per page", "spec": "Matcha #D1F470 fill with Licorice #11110D text on every ground, light or dark, radius 16px. The guide calls Matcha an accent to use intentionally: it marks the action and almost nothing else, so the page reads black, white and green-black with one bright green button per group", "once": "one Matcha primary per button group", "dont": "use Matcha for large areas, body text, or as a background; never white text on Matcha", "example": { "ground": "paper", "text": "Try for free", "button": true, "button_fill": "#D1F470" }, "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" }, { "id": "big-radius-cards", "name": "Soft 40px containers", "where": "content cards, event card, banners, image frames", "spec": "Large rounded rectangles (40px radius at desktop and phone, 32px on the hero, 16px for small cards) in Sesame, Fern or a 5% Licorice tint with a hairline; flat, no shadows. The guide's own imagery uses the same soft-cornered frames", "dont": "add drop shadows or sharp corners to content cards", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "green-dark-grounds", "name": "Fern and glow-green dark bands", "where": "report, final CTA, event card, product panels", "spec": "Dark sections are green-black, not neutral: flat Fern #203524 bands, Shamrock #2D4C33 panels, and a radial glow from #355E34 into Licorice at the bottom centre of product panels. Headlines on them are Sesame #F5F5F2", "dont": "use cold greys or blue-blacks for dark bands", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "people-plus-ui", "name": "People with a floating conversation", "where": "hero and brand imagery", "spec": "A warm, natural-light photo of one person, with white chat cards (avatar, name, short message; an AI agent card with green checks) floating over a corner. The guide: photography shows moments of connection made possible because something was resolved; product imagery shows capabilities in action", "dont": "use stock poses, abstract tech art or screenshots without people in the hero", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/" }, { "id": "green-word", "name": "One green word", "where": "section headlines and big numbers", "spec": "A single word of a headline (e.g. \"smarter\") and the stat numbers set in green #70A32A, the rest Licorice", "once": "one highlighted word per headline, at most one per section", "dont": "highlight whole lines or use Matcha #D1F470 for text on white (it fails contrast)", "example": { "ground": "paper", "text": "AI that gets smarter with every resolution.", "mark": "smarter", "mark_style": "color", "mark_color": "#70A32A" }, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } ], "page": { "source": "https://www.zendesk.com/", "date": "2026-10-31", "prov": "observed", "announcement": { "summary": "Licorice #11110D bar, 58px tall desktop (146px phone), centred row: bold \"AI Summit 2026\" 14px 700 white, 34px gap, message 14px/19.6px 400 white, then \"Register now\" 14px 600 white with a 1px white underline; 32px close X (white, 2px stroke) at right x 1392", "desktop": "padding 16px 48px; items centred on one line: title x 177, message x 318-1160, link x 1186", "phone": "stacked and centred: title 13px 700, message 13px/18.2px in 3 lines, Register now link; X at x 342 vertically centred", "ground": "#11110D" }, "nav": { "summary": "Licorice announcement bar, then a white two-row header: utility links top right, Zendesk primary logo (symbol over wordmark) at left, five centred menu items, Matcha \"Try for free\" and ghost \"View demo\" at right.", "ground": "#FFFFFF at 90% opacity (rgba(255,255,255,0.9)), sticky; a fine 1px light grey rule (about #D5D5D2) along its bottom edge", "height": "110px desktop (y 58-168, under the 58px announcement bar); 60px phone (y 146-206)", "border": "1px light grey bottom rule (rendered, about #D5D5D2)", "logo": { "variant": "Primary logo, Licorice: Z symbol stacked over the \"zendesk\" wordmark", "px": "84x60 (svg viewBox 78.4x56)", "position": "x 24, y 87 (vertically centred in the 110px header, sitting lower than the utility row)", "file": "https://www.zendesk.com/company/brand-guidelines/" }, "links": { "count": 5, "labels": "Platform, Products, Solutions, Resources, Pricing", "dropdowns": "12px chevron-down 8px after the label on all but Pricing", "size": "16px/23px", "weight": "600 (Figtree 640)", "color": "#11110D", "alignment": "centred group at x 377-922, baseline row y 128; about 34px between items" }, "utility": "Row at y 64-85, right-aligned ending x 1412: person icon + \"Sign in\", phone icon + \"Contact us\", globe icon + \"Language\" (14px/21px 400 #11110D, 16px line icons, 28px between)", "actions": [ "Try for free: Matcha #D1F470 fill, #11110D 16px/23px 600 text, radius 16px, padding 10px 16px, 114x43 at x 1176 y 106", "View demo: ghost, 1px rgba(17,17,13,0.32) ring, radius 16px, 115x43 at x 1301 y 106, 12px after Try for free" ], "sticky": "the 110px header is sticky (stays at top while scrolling); the announcement bar scrolls away", "phone": { "shows": "wordmark-only \"zendesk\" logo (no symbol, file zendesk-wordmark.svg) about 84px wide, vertically centred, at x 16; Matcha \"View demo\" button 115x43 at x 217 (the primary on phone is View demo); 32px hamburger (3 lines, #11110D) at x 344", "menu": "hamburger opens a full-screen menu with the same five items as accordions", "cta": "View demo stays visible" } }, "hero": { "summary": "An inset, rounded photo hero: a warm, sunlit photo of a woman in green headphones fills a 1408x772 card with 32px corners, darkened on the left; white type sits in the left half; a two-bubble chat overlay floats bottom right.", "desktop": { "section": "card x 16-1424 (16px inset from the viewport on both sides), y 184-956 (16px below the header), height 772, border-radius 32px, overflow hidden, ground #11110D under the photo", "photo": "PLACE THE IMAGE Hero-image_V01.jpg as background-size cover, background-position 50% 50% (the woman sits in the right half, face around x 960-1150, green headphones at x 1100-1290)", "overlay": "an ::after layer inset 0: linear-gradient(to right, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.25) 35%, rgba(0,0,0,0) 60%); this is what darkens the left side behind the copy", "text_column": "x 169 (153px inside the card), width 656; content block vertically centred in the card", "vertical_anchors": "eyebrow y 368; H1 y 395-609 (3 lines); lead y 633; trial line y 688; email form y 723-771", "headline_breaks": "3 lines exactly: \"Automate up to 80%\" / \"of interactions with\" / \"Zendesk AI agents.\"", "form": "input 430x48 at x 169 (white, radius 12px, inset 1px #D5D5D2 ring, placeholder \"Enter work email\" 15px, 12px padding) + \"Try for free\" primary 150x48 at x 619 (20px gap)", "trial_line": "16px white circle with a Licorice check, 4px gap, \"14-day free trial.\" 14px 700 white then \" No credit card required.\" 14px 400 white", "chat_overlay": "PLACE THE IMAGE Hero_Homepage__en_us.png (890x910 transparent PNG, two white chat cards with soft shadows: a customer bubble and an AI agent card with two green checks) at width 300px, right edge at x 1330, bottom edge at y 950 (box about x 1030-1330, y 642-950). It is Zendesk's own static fallback for the animated chat; the live animation cycles through different bubbles", "controls": "36px white circle pause button with a Licorice pause glyph at x 1374 y 834 inside the card (bottom right); separately the fixed chat launcher (see Chat launcher section)", "cta_size": "150x48" }, "phone": { "order": "text first on WHITE (no photo behind): eyebrow, H1, lead, trial line, full-width input, full-width Try for free; then the photo as its own rounded card below", "alignment": "left, 16px gutter", "sizes": "eyebrow 12px/15.6px 700 #11110D y 246; H1 43px/45.2px 500 #11110D in 5 lines (\"Automate up to / 80% of / interactions with / Zendesk AI / agents.\") y 270-496; lead 15px/21.75px y 520 (2 lines); trial line 13px y 595 with a Licorice check circle; input 358x48 y 630; Try for free 358x48 y 698", "photo_card": "x 16 y 794, 358x396, radius 32px, Hero-image_V01.jpg cover with background-position about 75% 50% (her face against the right edge, the phone near the lower centre, warm empty space at left for the chat cards), with Hero_Homepage__en_us.png 269x350 contain at x 61 y 844 over it" }, "at_rest": "Static: the chat overlay shows the two cards in Hero_Homepage__en_us.png. No privacy line is visible under the form in the resting screenshot; do not draw one.", "media": "Hero-image_V01.jpg (1766x1176) + Hero_Homepage__en_us.png overlay", "type": "eyebrow 14px/18.2px 700 uppercase +0.75px #F5F5F2 \"AI-POWERED CUSTOMER SERVICE PLATFORM\"; H1 68px/71.4px 500 #F5F5F2; lead 16px/23.2px 400 #FFFFFF", "cta": "email capture + Matcha \"Try for free\"", "proof": "none in the hero; the logo band follows" }, "sections": [ { "name": "Customer logo band", "summary": "White band: a two-line eyebrow at left and eight monochrome Licorice customer logos in one row.", "ground": "#FFFFFF", "desktop": { "band": "y 956-1180 (224px), padding 88px 0", "label": "\"22,000+ SERVICE TEAMS TRUST ZENDESK AI\" eyebrow 14px/18.2px 700 uppercase #11110D, max width 258 (2 lines) at x 169 y 1050", "logos": "8 logos 48px tall in one row from x 451 to 1271, about 32px apart: Siemens 87, GitHub 55, Uber 51, Box 41, Vimeo 70, Lush 69, Tesco 82, Discord 140 (widths px); vertically centred on the label" }, "phone": { "band": "y 1190-1503, padding 48px 0", "label": "one line centred 12px", "logos": "56px tall, centred rows of 4 (Siemens, GitHub, Uber, Box), 3 (Vimeo, Lush, Tesco), 1 (Discord), 12px row gap" }, "anatomy": [ "Logos are flat Licorice #11110D marks on white; files Siemens_Default.png, Github_Default.png, Uber_Default.png, Box_Default.png, Vimeo_Default.png, Lush_Default.png, Tesco_Default.png, Discord_Default.png (each 112px tall at 2x, draw at 48px tall)", "No dividers, no carousel motion at rest" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Event card (AI Summit)", "summary": "A 40px-radius Fern card split in two: a Shamrock text panel and a Fern countdown panel at left, a two-speaker photo at right.", "ground": "#FFFFFF", "desktop": { "band": "y 1180-1850, padding 88px 0", "card": "x 169 y 1268, 1102x494, radius 40px, overflow hidden, fill #203524", "left_top": "x 169-830, y 1268-1596 (661x328), fill #2D4C33, padding 32px: lockup image AI-Summit-26-lockup-horizontal.png 550x40 at x 201 y 1300; body 16px/23.2px #FFFFFF in 3 lines (w 597) at y 1367; \"DIGITAL EVENT\" eyebrow 14px 700 #D1F470 y 1455; \"NOVEMBER 12, 2026\" eyebrow #F5F5F2 y 1481; Register now primary 150x48 at y 1516", "left_bottom": "y 1596-1763 (167px), fill #203524: \"Secure your spot\" 26px/32.5px 500 #F5F5F2 at y 1628; three countdown tiles 188x54 at x 201, 405, 610 (16px gaps), y 1676, radius 8px, fill #2D4C33 with a 1px border drawn as a gradient (to left bottom, rgba(255,255,255,0.2), #FFFFFF, #FFFFFF, rgba(255,255,255,0.2)); digits 32px/32px 300 #FFFFFF centred", "right": "x 830-1271 (441x494) CountdownSpeakers.jpg as background cover, no radius of its own (clipped by the card)" }, "phone": { "card": "x 16 y 1551, 358x834, radius 40px", "order": "Shamrock panel (350px: lockup 310x22, body 15px 6 lines, eyebrows 12px, Register now full width 294x48), speakers image 358x269, Fern countdown panel (216px: title 22px, tiles 147x54 two across then one 310x54 full width)" }, "anatomy": [ "Countdown at rest shows \"12d\", \"2h\", \"39m\" (a live countdown to November 12, 2026; print exactly these three values)", "The lockup image is white \"AI Summit\" with a superscript \"26\" and \"a zendesk event\" in white; place the file, do not typeset it" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Platform intro and timeline cards", "summary": "Centred H2 with one word in green, a lead and a Matcha button; below, three translucent 40px cards stacked down the page, threaded on a thin vertical grey connector line, each with a title at left and a product illustration at right.", "ground": "#FFFFFF", "desktop": { "band": "y 1850-3759", "h2": "\"AI that gets smarter with every resolution.\" 42px/48.3px 500 #11110D centred, max width 727 at y 1938, 2 lines (\"AI that gets smarter with every\" / \"resolution.\"); the word \"smarter\" in #70A32A", "lead": "16px/23.2px #11110D centred, 2 lines, max 727, y 2059", "button": "Explore the platform primary 212x48 centred at y 2145", "connector": "2px wide vertical line at x 719-720, rendered #D7D7D7, from y 2265 (fading in from white over the first 60px) down through all three cards to y 3680 (fading out after the last card); it runs behind the cards and shows in the gaps", "cards": "3 cards x 169 w 1102 h 322, tops at y 2365, 2823, 3281 (136px gaps), radius 40px, fill rgba(17,17,13,0.05) (renders about 95% white on white), 1px solid rgba(17,17,13,0.11) border, padding 40px", "card_inside": "title 26px/32.5px 500 #11110D at x 210, top padding 41px, max width 425 (2 lines each: \"Every conversation / becomes a learning signal\", \"Zendesk AI turns signals / into improvement\", \"Faster resolutions. Stronger / loyalty. Better outcomes.\"); illustration box x 720-1230 (510x240) at the card top + 41px, image object-fit contain, centred" }, "phone": { "h2": "30px/34.5px centred 2 lines", "lead": "15px 4 lines", "button": "full width 358x48", "cards": "358x315 radius 40px, 160px apart; title 22px/27.5px at 24px padding; illustration 308x154 below the title" }, "anatomy": [ "Illustrations: RLL_ProductImagery_01__en_gb.png (chat: customer asks about a return, AI agent hands off), RLL_ProductImagery_02__en_gb.png (\"Fill knowledge gaps\" panel with two topic rows and blue \"Generate article\" buttons), RLL_ProductImagery_03__en_gb.png (customer asks to return an item; AI agent answers). Transparent PNGs; place them, never redraw", "Cards carry no buttons, no shadow" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Stats row", "summary": "A centred two-line statement and three big green numbers with small labels.", "ground": "#FFFFFF", "desktop": { "band": "y 3759-4204, padding 88px 0", "h3": "\"Trillions of data points turned into billions of successful outcomes.\" 26px/32.5px 500 #11110D centred, max 727, 2 lines, y 3847", "stats": "three columns of the 1102 container (centres x 352, 720, 1087), numbers 72px/72px 500 #70A32A at y 4003, labels 16px/23.2px 400 #11110D centred at y 4093", "values": "\"22K+\" AI customers, \"830M\" AI interactions, \"4.8B\" Resolutions delivered (final values of an odometer roll-up; print them static)" }, "phone": { "stats": "stacked and centred, numbers 56px/56px, labels 15px, 182px pitch (y 4445, 4627, 4809)" }, "anatomy": [ "No cards, no icons; just type" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Forethought split", "summary": "Two columns: eyebrow with a Matcha NEW chip, H2, body and two buttons at left; a black rounded card with the Zendesk + Forethought logos at right.", "ground": "#FFFFFF", "desktop": { "band": "y 4204-4714, padding 88px 0", "left": "x 169 w 515: eyebrow \"ZENDESK + FORETHOUGHT\" 14px 700 at y 4305 with chip \"NEW\" (Matcha, radius 4px, 51x23) 12px after; H2 42px/48.3px \"Standalone AI agents for / any platform\" at y 4336; body 16px 3 lines y 4456; buttons y 4566: \"Request Forethought demo\" primary 271x48 + \"Learn more\" ghost 136x48, 12px gap", "right": "Photo_ZendeskForethought.png at x 826 y 4292, 445x334, radius 40px, object-fit cover (the file is the Licorice card with both white logos and a thin divider)" }, "phone": { "order": "eyebrow, H2 30px 2 lines, body 15px 4 lines, both buttons full width stacked (12px gap), image 358x269 radius 40px" }, "anatomy": [ "Column text block vertically centred on the image" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Open Service Directory banner", "summary": "A Fern 40px-radius banner: a square thumbnail, a title with body, and a Matcha button at right.", "ground": "#FFFFFF", "desktop": { "band": "y 4714-5162", "card": "x 169 y 4802, 1102x272, radius 40px, fill #203524", "thumb": "OSD-blog.png 144x144 radius 16px at x 265 y 4866", "text": "x 441 w 456: \"Introducing Open Service Directory\" 26px/32.5px 500 #F5F5F2 at y 4883 (1 line), body 16px/23.2px #FFFFFF 3 lines", "button": "\"Read the announcement\" primary 246x48 at x 929, vertically centred (y 4914)" }, "phone": { "card": "358x470, padding 32px 24px, everything centred: thumbnail 144, title 22px 2 lines, body 15px 4 lines, button full width 310x48" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Dark platform panel with tabs", "summary": "A near-black panel lit from below by a green radial glow: centred H2, lead and two buttons, then a tab list at left and a product screenshot with caption at right.", "ground": "gradient", "desktop": { "band": "section x 145-1295 (1150 wide, 24px wider than the container each side), y 5162-6185 (1023 tall), radius 16px, background radial-gradient(at 50% 85%, #355E34 25%, #11110D 100%)", "h2": "\"Designed for AI-first customer / service\" 42px/48.3px 500 #F5F5F2 centred at y 5250", "lead": "16px #FFFFFF centred 2 lines, y 5371", "buttons": "Try for free primary 132x48 + Learn more ghost (white label, rgba(255,255,255,0.32) ring) 136x48, centred, y 5457", "tabs_panel": "x 185 y 5569, 1070x528, radius 16px, fill rgba(17,17,13,0.18), overflow hidden", "tab_list": "left column 250 wide, 5 rows 106px tall, each with a 1px rgba(255,255,255,0.1) bottom border; labels 16px/22.4px 600 #FFFFFF at x 209, 2 lines in about 160px: \"Manage high volume autonomously\", \"Launch in minutes, not months\", \"Scale without adding headcount\", \"Trust every AI-driven resolution\", \"Modernize voice with Agentic AI\". Active row (first) fill rgba(17,17,13,0.32) with a 2px #D1F470 (Matcha) bar on its right edge; inactive rows fill rgba(17,17,13,0.11), labels at 70% white", "content": "image ProductImagery_AIAgent_Messaging_CustomEntityIntent__en_us.png contain in 464x348 at x 613 y 5604 (phone mock with a chat and a soft green glow); caption 16px/23.2px #FFFFFF centred, 3 lines, w 464, y 5977" }, "phone": { "section": "x 0-390, radius 16px, same radial gradient", "tabs": "accordion: 5 rows 62px tall, 1px rgba(255,255,255,0.1) dividers, label 15px 600 left, 21px chevron right; the open row has a 2px #D1F470 top line and shows its image 287x215 and caption 15px", "buttons": "full width 319x48 stacked" }, "anatomy": [ "Other tab images (shown when each tab is active): ProductImagery_AIAgentBuilder_AIAgent_ProductImagery__en_us.png, ProductImagery_AIAgents_Insights__en_us.png, ProductImagery_QualityAssurance_AIAgent_ProductImagery__en_us.png, ProductImagery_Intent_VoiceAIAgents__en_us.png", "At rest only the first tab is active" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Two product cards", "summary": "Centred H2 above two Sesame cards side by side, each with a dark product image on top, a title, body and two buttons.", "ground": "#FFFFFF", "desktop": { "band": "y 6185-7111, padding 88px 0", "h2": "\"Extend the power of AI-first service / across your entire organization.\" 42px/48.3px centred, max 727, y 6273", "cards": "2 cards 539x565 at x 169 and 732 (24px gap), y 6458, radius 40px, fill #F5F5F2, overflow hidden", "card_image": "top 539x303 object-fit cover: ProductImagery_EmployeeService__en_us.png and ProductImagery_ContactCenter__en_us.png (dark green glow scenes with white UI)", "card_body": "padding 32px: title 26px/32.5px 500 at y +335 (\"Employee Service\", \"Contact Center\"); body 16px 3 lines; buttons at y +485: \"Try for free\" primary + \"Learn more\" ghost; \"Contact sales\" primary + \"Learn more\" ghost" }, "phone": { "cards": "stacked 358x542, 48px apart; image 358x201; title 22px; buttons full width 310x48 stacked" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Gartner report band", "summary": "Full-bleed Fern band: eyebrow, title, body and button at left; a white Magic Quadrant chart at right.", "ground": "#203524", "desktop": { "band": "y 7111-7871 (760px), padding 88px 0, full width", "left": "x 169 w 421, vertically centred: \"REPORT\" eyebrow 14px 700 #F5F5F2 y 7334; title 26px/32.5px 500 #F5F5F2, 4 lines, y 7360; body 16px #FFFFFF 2 lines y 7514; \"Read the report\" primary 171x48 y 7600", "right": "Blockframe_GartnerMQ2025_Graph-1.png at x 732 y 7199, 539x584, no radius, object-fit cover (white chart card)" }, "phone": { "order": "eyebrow 12px, title 22px 4 lines, body 15px, button full width, chart 358x388" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Testimonial carousel", "summary": "Centred H2 and lead, then one big Sesame card: customer logo, bold quote, name and role, a text link, arrow controls; at right a square video still with a translucent stats strip.", "ground": "#FFFFFF", "desktop": { "band": "y 7871-8756", "h2": "\"Built for businesses of all sizes\" 42px centred y 7959; lead 16px centred y 8031", "card": "x 169 y 8150, 1102x518, radius 40px, fill #F5F5F2, padding 32px", "left": "Vimeo_Large.png 160x45 at x 201 y 8182; quote 16px/23.2px 600 #11110D, w 463, 3 lines, y 8247, with curly quotes (published opening, the part we may quote: “There’s a wealth of information in these AI agent conversation logs.”; the site continues for two more lines about using them for support, product and strategy; paraphrase that or end the quote there); name \"Noah Kardos-Fein\" 16px 700 y 8341; role \"Director of Digital Support at Vimeo\" 16px 400 y 8368; \"Read customer story\" text link 16px 600 with underline y 8409", "controls": "prev and next: 56px circles (render #EAEAE7 on Sesame) with 24px Licorice arrow icons at x 193 and x 347, y 8588; between them 4 dots 6px, 14px apart: first filled #11110D, others 1px rgba(17,17,13,0.18) ring", "right": "Vimeo_Image_Testimonials_2x.png 454x454 at x 785 y 8182, radius 20px; stats strip over its bottom 143px: flat even fill rgba(17,17,13,0.5) (reads as a dark green strip over the green photo; no visible blur banding), radius 0 0 20px 20px; two stats centred in halves: \"36%\" and \"30-40%\" 40px/40px 500 #F5F5F2 (the % sign at 26px), labels \"increase in AI agent volume\", \"automation rate\" 16px 600 #F5F5F2, each in a 195px-wide centred box so the first wraps to 2 lines" }, "phone": { "card": "358x653, radius 20px, centred content: logo 310x45, image block with stats first, then quote 15px 600 centred, link, controls centred" }, "anatomy": [ "The quote is the customer's own words; reproduce exactly as published on zendesk.com or use your own customer" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Integrations split", "summary": "H2, body and one Matcha button at left; a grid of partner app tiles fading at top and bottom at right.", "ground": "#FFFFFF", "desktop": { "band": "y 8756-9368, padding 88px 0", "left": "x 169 w 421: H2 \"Connect your ecosystem. / Your way.\" 42px y 8923; body 16px 3 lines y 9044; \"Learn more\" primary 136x48 y 9154", "right": "Logos_Marketplace.png at x 732 y 8844, 539x436, object-fit cover (3 columns of white app chips with soft shadows; top and bottom rows faded)" }, "phone": { "order": "H2 30px, body, button full width, image 358x290" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Additional resources", "summary": "Left-aligned H2 and four equal Sesame cards, each a photo or render on top and a typed eyebrow, title and text link below.", "ground": "#FFFFFF", "desktop": { "band": "y 9369-10061, padding 88px 0", "h2": "\"Additional resources\" 42px left at x 169 y 9457", "cards": "4 cards 258x379 at x 169, 451, 733, 1015 (24px gaps), y 9593, radius 16px, fill #F5F5F2, 1px transparent border", "card_inside": "image 256x192 cover at top (inset 1px): Resources_Product_Platform.png, Resources_Report_CX_Trends.png, Resources_Guide_Zendesk_AI.png, Resources_Article_Customer_Support.png; then padding 24px: 16px line icon + eyebrow 14px 700 uppercase (\"PRODUCT\" + Matcha \"FEATURED\" chip, \"REPORT\", \"GUIDE\", \"ARTICLE\") at y 9818; title 16px/23.2px 600 (\"A powerful, flexible platform\", \"CX Trends 2026\", \"Zendesk AI: the service superpower\", \"What is customer support?\"); \"Learn more\" text link 16px 600 underlined, aligned across cards at y 9913" }, "phone": { "cards": "horizontal scroll row: same 258x370 cards at 274px pitch starting x 16; the second card shows partly" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Pricing card", "summary": "One centred Sesame card: H2, lead, primary and ghost buttons.", "ground": "#FFFFFF", "desktop": { "band": "y 10060-10483", "card": "x 169 y 10148, 1102x247, radius 40px, fill #F5F5F2", "inside": "H2 \"Pricing built for your success\" 42px centred y 10180; lead 16px centred 2 lines max 695 y 10253; \"See plans & pricing\" primary 201x48 + \"Calculate your ROI\" ghost 193x48 centred y 10315" }, "phone": { "card": "x 16, 358x346 radius 40px, padding 24px; H2 30px 2 lines; buttons full width 310x48 stacked" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Final CTA band", "summary": "Full-bleed Fern band with a small green AI icon before a one-line H2 and two buttons, all centred.", "ground": "#203524", "desktop": { "band": "y 10483-10779 (296px), padding 88px 0", "h2": "ai-agent-sparkle-icon.png 42x42 at x 388 then \"Launch your first AI agent today\" 42px 500 #F5F5F2 centred at y 10571", "buttons": "Try for free primary 132x48 + Get a demo ghost (white) 136x48 centred, y 10643" }, "phone": { "h2": "30px centred 2 lines with the 30px icon before the first word", "buttons": "full width 358x48 stacked" }, "anatomy": [ "The icon is a green gradient sparkle-plus-headset glyph; place the file" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "FAQ band", "summary": "Same Fern band continues: \"Need to know more?\" centred and a \"View FAQs\" toggle between two hairlines; collapsed at rest.", "ground": "#203524", "desktop": { "band": "y 10779-11042 (263px), padding 88px 0, no visible seam with the band above", "title": "\"Need to know more?\" 26px/32.5px 500 #F5F5F2 centred y 10867", "toggle": "\"View FAQs\" 18px 600 #FFFFFF with a 24px chevron-down, centred at y 10926; two 1px rgba(255,255,255,0.13) rules 448px long either side at y 10939 (x 169-617 and x 824-1272)" }, "phone": { "title": "22px centred", "toggle": "centred, no side rules" }, "anatomy": [ "At rest the accordion is closed: draw no questions" ], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "name": "Chat launcher", "summary": "Zendesk's own messaging launcher, fixed at bottom right on every screen.", "ground": "#11110D", "desktop": { "launcher": "fixed 64x64 circle #11110D at right 16px, bottom 16px (x 1360 y 820 in a 900-tall viewport), box-shadow 0 20px 30px rgba(23,73,77,0.15), white 36px speech-bubble icon" }, "phone": { "launcher": "same 64px circle at x 310, bottom right" }, "anatomy": [], "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } ], "footer": { "summary": "Licorice footer: five link columns, a hairline, a big \"How can we help? Contact us.\" line with social icons at right, a second hairline and a legal row.", "ground": "#11110D", "anatomy": [ "Band y 11042-12174; content in the 1102px container from x 169; top padding 94px", "Columns at x 169, 394, 619, 845, 1070 (225px pitch, 201px wide); headings 16px/23.2px 600 #F5F5F2 at y 11136; links 14px/21px 400 #FFFFFF, 40px pitch starting 43px below the heading; no underline at rest", "Products: Pricing, Zendesk for customer service, Zendesk for employee service, Zendesk for contact center, Integrations, System status, Sign in, Demo, Zendesk for Enterprise, Zendesk for Small Business, Zendesk for Startups", "Features: AI agents, Specialized AI agents, Copilot, Zendesk AI, Messaging and live chat, Advanced Data Privacy and Protection (2 lines), Knowledge base, Ticketing, Voice, Community forums, Reporting and analytics, Workforce management, Quality assurance, Live chat, Client portal", "Resources: Help center, Security, API and developers, Blog, AI research, Events and webinars, Customer stories, Academy, Partners, Professional services, Trial experience & FAQs", "Company: About us, Newsroom, What is Zendesk?, Careers, Inclusion & Belonging, Accessibility Plan, Sustainability report, Zendesk Foundation, Zendesk Ventures, Legal; then a second heading Compare at y 11576: Zendesk vs. Intercom, Zendesk vs. Salesforce, Zendesk vs. Freshdesk", "Popular topics: CX Trends 2026, Product updates, Join our research panel, Customer service software, Help desk ticketing software, Live chat software, Forum software, Help desk software, Client portal software, Knowledge base software, Top AI agents", "1px #42433E rule across the container at y 11864", "\"How can we help? \" 42px/48.3px 500 #F5F5F2 + \"Contact us.\" 42px 600 #D1F470 with a 2px #D1F470 underline, at x 169 y 11929", "Social icons right-aligned ending x 1271, y 11942: X, Facebook, LinkedIn, YouTube, Instagram, TikTok, white, 32px tall (YouTube 40 wide), 48px pitch (files social-x.svg, social-facebook.svg, social-linkedin.svg, social-youtube.svg, social-instagram.svg, social-tiktok.svg)", "1px #42433E rule at y 12051", "Legal row y 12116, 14px 400 #FFFFFF, 12px apart: Terms of Use, Privacy Notice, Cookie Notice, Cookie settings, Trust Center, then \"© 2026 Zendesk, Inc.\"; band ends y 12174", "No logo, address or phone number in the footer" ], "phone": "Contact line centred 30px on 2 lines (\"How can we help?\" / \"Contact us.\"), socials centred row (48px pitch), then a 1px rule and six accordion rows (15px 600 #F5F5F2 heading at x 32, 22px chevron at x 336, 1px #42433E dividers, 62px rows); the first (Products) is open showing its links in a 2-column grid (x 32 and 201, 14px/17.5px, 32px row pitch); legal links centred on 2 lines" }, "dark_ground": { "secondary_button": "ghost with #FFFFFF label and 1px rgba(255,255,255,0.32) ring; hover fill rgba(255,255,255,0.07)", "primary_button": "still Matcha #D1F470 with #11110D text", "link": "#FFFFFF with 1px white underline; footer links no underline", "headline": "#F5F5F2 (Sesame), never pure white", "body": "#FFFFFF", "muted_text": "none: dark grounds use #F5F5F2 and #FFFFFF only", "hairline": "#42433E on Licorice; rgba(255,255,255,0.1-0.13) on Fern and the gradient panel", "logo_variant": "white wordmark/primary logo (zendesk-logo-white.svg) where a logo sits on dark; the homepage never puts the logo on dark" } }, "bands": [ { "label": "Announcement bar", "ground": "#11110D", "content": "event promo line + Register now link + close X", "desktop": "58px tall, one centred row", "phone": "146px, stacked and centred", "anatomy": [ "Bold title, 14px message, underlined white link; X at right" ] }, { "label": "Header", "ground": "#FFFFFF", "content": "utility row, primary logo, 5 menu items, Try for free + View demo", "desktop": "110px, sticky, white at 90%", "phone": "60px: wordmark, View demo (Matcha), hamburger", "anatomy": [ "Primary logo symbol-over-wordmark 84x60 at x 24" ] }, { "label": "Hero photo card", "ground": "photo-dark", "content": "eyebrow, 3-line 68px H1, lead, trial line, email form, chat overlay", "desktop": "1408x772 card inset 16px, radius 32px, left-darkening gradient over the photo", "phone": "text on white, then a 358x396 radius-32 photo card", "anatomy": [ "Photo Hero-image_V01.jpg cover; overlay Hero_Homepage__en_us.png bottom right" ] }, { "label": "Logo band", "ground": "#FFFFFF", "content": "2-line eyebrow + 8 Licorice customer logos", "desktop": "224px, one row", "phone": "4/3/1 centred rows", "anatomy": [ "Logos 48px tall desktop, 56px phone" ] }, { "label": "Event card", "ground": "#FFFFFF", "content": "Fern card: Shamrock text panel + countdown panel + speakers photo", "desktop": "1102x494, radius 40px", "phone": "358x834 stacked", "anatomy": [ "Countdown tiles radius 8px with gradient 1px border" ] }, { "label": "Platform intro + 3 timeline cards", "ground": "#FFFFFF", "content": "centred H2 with green \"smarter\", lead, button; 3 translucent cards on a vertical connector", "desktop": "cards 1102x322 radius 40px, 136px gaps", "phone": "cards 358x315", "anatomy": [ "Connector line 2px #D7D7D7 at x 719-720" ] }, { "label": "Stats row", "ground": "#FFFFFF", "content": "26px statement + 3 green 72px numbers", "desktop": "3 columns", "phone": "stacked 56px numbers", "anatomy": [ "22K+ / 830M / 4.8B in #70A32A" ] }, { "label": "Forethought split", "ground": "#FFFFFF", "content": "eyebrow + NEW chip, H2, body, 2 buttons | logo card image", "desktop": "text x 169 w 515, image 445x334 radius 40px", "phone": "stacked", "anatomy": [ "Matcha NEW chip radius 4px" ] }, { "label": "Open Service Directory banner", "ground": "#FFFFFF", "content": "Fern card with thumbnail, title, body, button", "desktop": "1102x272 radius 40px", "phone": "358x470 centred stack", "anatomy": [ "Thumbnail 144x144 radius 16px" ] }, { "label": "Dark platform panel", "ground": "#11110D", "content": "H2, lead, 2 buttons, tab list + product image + caption", "desktop": "1150x1023 radius 16px, radial green glow from the bottom", "phone": "accordion tabs", "anatomy": [ "radial-gradient(at 50% 85%, #355E34 25%, #11110D 100%)" ] }, { "label": "Two product cards", "ground": "#FFFFFF", "content": "H2 + 2 Sesame cards with dark images", "desktop": "539x565 radius 40px", "phone": "stacked 358x542", "anatomy": [ "Image top 303px, cover" ] }, { "label": "Gartner band", "ground": "#203524", "content": "eyebrow, 26px title, body, button | white chart", "desktop": "full bleed 760px", "phone": "stacked", "anatomy": [ "Chart 539x584, square corners" ] }, { "label": "Testimonial", "ground": "#FFFFFF", "content": "H2, lead, Sesame card: logo, quote, name, link, controls | image with stats strip", "desktop": "card 1102x518 radius 40px", "phone": "card 358x653 radius 20px", "anatomy": [ "Stats strip rgba(17,17,13,0.5) over the image bottom" ] }, { "label": "Integrations split", "ground": "#FFFFFF", "content": "H2, body, button | app tiles image", "desktop": "image 539x436", "phone": "stacked", "anatomy": [ "Logos_Marketplace.png" ] }, { "label": "Additional resources", "ground": "#FFFFFF", "content": "H2 + 4 resource cards", "desktop": "258x379 radius 16px", "phone": "horizontal scroll", "anatomy": [ "Eyebrow with 16px icon; Learn more link" ] }, { "label": "Pricing card", "ground": "#FFFFFF", "content": "Sesame card: H2, lead, 2 buttons", "desktop": "1102x247 radius 40px", "phone": "358x346", "anatomy": [ "Centred" ] }, { "label": "Final CTA + FAQ", "ground": "#203524", "content": "icon + H2 + 2 buttons; \"Need to know more?\" + View FAQs toggle", "desktop": "296px + 263px, one continuous Fern field", "phone": "stacked full-width buttons", "anatomy": [ "Rules rgba(255,255,255,0.13) beside View FAQs" ] }, { "label": "Footer", "ground": "#11110D", "content": "5 link columns, rule, contact line + socials, rule, legal", "desktop": "1132px tall", "phone": "accordions", "anatomy": [ "Rules 1px #42433E" ] } ], "layout": { "page_margin": { "desktop": 169, "phone": 16 }, "section_padding": { "desktop": 88, "phone": 48 }, "container_max": 1102, "hero_text_max": 656, "columns": 12, "columns_phone": 4, "gutter": 24, "gutter_phone": 16, "card_gap": 24, "nav_height": 110, "note": "Measured on https://www.zendesk.com/ (2026-10-31) at 1440 and 390. Content container 1102px (x 169-1271). Bands pad 88px top and bottom (48px phone). Two-column splits: 539px halves with 24px gap (x 169 and 732). Inset cards (hero, event, timeline, OSD, pricing, testimonial) are radius 40 except the hero (32) and the dark platform panel (16). Hero card is inset 16px from the viewport; the dark platform panel is 24px wider than the container each side. Phone: 16px gutter, cards full gutter width (358).", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "type": [ { "role": "Hero H1 (Vanilla Sans 500)", "id": "display-xl", "face": "display", "size": { "desktop": 68, "phone": 43 }, "line_height": 1.05, "tracking_px": 0, "weight": 560, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "68/71.4 desktop, 43/45.2 phone; #F5F5F2 on the photo, #11110D on phone white" }, { "role": "Section H2 (Vanilla Sans 500)", "id": "display-l", "face": "display", "size": { "desktop": 42, "phone": 30 }, "line_height": 1.15, "tracking_px": 0, "weight": 560, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "42/48.3 desktop, 30/34.5 phone" }, { "role": "Stat number (Vanilla Sans 500)", "id": "stat", "face": "display", "size": { "desktop": 72, "phone": 56 }, "line_height": 1, "tracking_px": 0, "weight": 560, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "#70A32A; testimonial stats 40/40 #F5F5F2 with the % sign at 26px" }, { "role": "Card / band title H3 (Vanilla Sans 500)", "id": "title-m", "face": "display", "size": { "desktop": 26, "phone": 22 }, "line_height": 1.25, "tracking_px": 0, "weight": 560, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "26/32.5 desktop, 22/27.5 phone" }, { "role": "Footer contact line (Vanilla Sans 500)", "id": "contact", "face": "display", "size": { "desktop": 42, "phone": 30 }, "line_height": 1.15, "tracking_px": 0, "weight": 560, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "\"Contact us.\" in 600 Matcha" }, { "role": "Body (Vanilla Sans 400)", "id": "body", "face": "body", "size": { "desktop": 16, "phone": 15 }, "line_height": 1.45, "tracking_px": 0, "weight": 460, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "16/23.2 desktop, 15/21.75 phone" }, { "role": "Strong body: quote, card titles, tab labels (Vanilla Sans 600)", "id": "body-strong", "face": "body", "size": { "desktop": 16, "phone": 15 }, "line_height": 1.45, "tracking_px": 0, "weight": 640, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "role": "Button label (Vanilla Sans 600)", "id": "button", "face": "body", "size": { "desktop": 18, "phone": 18 }, "line_height": 1.556, "tracking_px": 0, "weight": 640, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "18/28; nav buttons 16/23" }, { "role": "Nav link (Vanilla Sans 600)", "id": "nav", "face": "body", "size": { "desktop": 16, "phone": 16 }, "line_height": 1.44, "tracking_px": 0, "weight": 640, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "role": "Eyebrow (Vanilla Sans 700 uppercase, +0.75px)", "id": "eyebrow", "face": "body", "size": { "desktop": 14, "phone": 12 }, "line_height": 1.3, "tracking_px": 0.5, "weight": 780, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "note": "uppercase; site tracking 0.75px, 0.5px with Figtree" }, { "role": "Small: announcement, utility links, footer links (Vanilla Sans 400)", "id": "small", "face": "body", "size": { "desktop": 14, "phone": 13 }, "line_height": 1.5, "tracking_px": 0, "weight": 460, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "role": "Countdown digits (Vanilla Sans 300)", "id": "countdown", "face": "body", "size": { "desktop": 32, "phone": 32 }, "line_height": 1, "tracking_px": 0, "weight": 300, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } ], "components": { "button_primary": { "fill": "#D1F470", "text": "#11110D", "radius": 16, "height": 48, "padding": "10px 20px", "padding_x": 20, "font_size": 18, "weight": 640, "face": "body", "text_style": "18px/28px Vanilla Sans 600 (Figtree 640)", "note": "Matcha fill with Licorice text on every ground, light or dark. Nav size: 43px tall, padding 10px 16px, 16px/23px", "example": "Try for free 132x48; Explore the platform 212x48", "states": { "hover": { "prov": "observed", "measured": { "text": "rgba(17,17,13,0.7)", "overlay": "::before fill rgba(17,17,13,0.05)", "transition": "0.6s cubic-bezier(0.7, 0, 0.3, 1)" }, "css": { "color": "rgba(17, 17, 13, 0.7)", "box-shadow": "inset 0 0 0 999px rgba(17, 17, 13, 0.05)", "transition": "color 0.6s cubic-bezier(0.7, 0, 0.3, 1), box-shadow 0.1s linear" } }, "focus": { "prov": "observed", "css": { "outline": "2px solid rgba(17, 17, 13, 0.47)", "outline-offset": "3px" } } }, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "button_secondary": { "fill": "none", "text": "#11110D", "radius": 16, "height": 48, "padding": "10px 20px", "padding_x": 20, "font_size": 18, "weight": 640, "face": "body", "ring_px": 1, "ring": "#11110D", "ring_alpha": 0.32, "note": "Ghost: transparent with a 1px rgba(17,17,13,0.32) ring (drawn by ::before). On dark grounds the label is #FFFFFF and the ring rgba(255,255,255,0.32); hover fill rgba(255,255,255,0.07). Always sits right of a primary, 12px gap", "example": "Learn more 136x48; View demo (nav) 115x43", "states": { "hover": { "prov": "observed", "measured": { "text": "rgba(17,17,13,0.7)", "overlay": "rgba(17,17,13,0.05)" }, "css": { "color": "rgba(17, 17, 13, 0.7)", "background-color": "rgba(17, 17, 13, 0.05)" } } }, "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "text_link": { "text": "#11110D", "font_size": 16, "weight": 640, "note": "Inline CTA (\"Read customer story\", resource \"Learn more\", announcement \"Register now\"): 1px underline 2-3px below the baseline in the text colour at rest; on hover the text goes to 70% and the underline sweeps (background-size 250% 1px moving 100% -> 0% over 0.6s cubic-bezier(0.7, 0, 0.3, 1))", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "input": { "fill": "#FFFFFF", "radius": 12, "height": 48, "note": "inset 0 0 0 1px #D5D5D2 ring, padding 12px, placeholder \"Enter work email\" 15px #11110D-ish grey", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "card": { "fill": "#F5F5F2", "radius": 40, "note": "Big content cards (event, timeline, product pair, testimonial, pricing, OSD) are radius 40; resource cards radius 16; testimonial image radius 20; no shadows anywhere", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "chip": { "fill": "#D1F470", "text": "#11110D", "radius": 4, "note": "\"NEW\" / \"FEATURED\": 14px 700 uppercase +0.75px, height 23px, padding 4px 8px, placed 12px after an eyebrow", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } } }, "system": { "fixed": [ "Licorice and Coconut foundation", "Matcha only for intentional accents and primary actions", "Primary logo unaltered in Licorice or Coconut", "People-first photography", "Brief, focused, human copy" ], "flex": "How much dark green appears: a page can run nearly all white or alternate Fern bands and green-glow panels.", "traits": [ { "is": "Confident", "not": "Arrogant", "text": "One of the three feelings copy should create (published); the \"not\" is our reading.", "source": "https://www.zendesk.com/company/brand-guidelines/", "prov": "published" }, { "is": "Included", "not": "Exclusive or technical", "text": "Readers should feel included; the \"not\" is our reading.", "source": "https://www.zendesk.com/company/brand-guidelines/", "prov": "published" }, { "is": "Credible", "not": "Hyped", "text": "Readers should feel the claims are credible; the \"not\" is our reading.", "source": "https://www.zendesk.com/company/brand-guidelines/", "prov": "published" }, { "is": "Approachable", "not": "Casual to a fault", "text": "Attribute on the brand page voice card.", "source": "https://www.zendesk.com/company/brand-guidelines/", "prov": "published" }, { "is": "Modern and fresh", "not": "Trendy", "text": "Attributes on the voice card.", "source": "https://www.zendesk.com/company/brand-guidelines/", "prov": "published" } ] }, "formats": [ { "format": "Landing page", "level": 3, "must": "Build it the way www.zendesk.com is built (kit.spec.page, homepage voice): Licorice announcement bar, white sticky two-row header with the primary logo, an inset 32px-radius photo hero darkened on the left with a floating chat card, Licorice logo band, 40px-radius Sesame/Fern cards, Fern full-bleed bands, Matcha primary + ghost secondary buttons (radius 16), Licorice footer", "flex": "which sections and how many cards; a lighter all-white page for simple pages" }, { "format": "Deck", "level": 2, "must": "Coconut slides with Licorice type, one Fern or Licorice title slide, Matcha only for the key number or call to action, people photography", "flex": "how many dark slides" }, { "format": "Social post", "level": 3, "must": "One person photo or a chat card on Fern, sentence-case 500 headline, Matcha accent", "flex": "photo vs product imagery" }, { "format": "Email", "level": 1, "must": "White ground, Licorice text, one Matcha button, primary logo top left", "flex": "a Sesame card for the main offer" } ], "checks": [ { "name": "Logo hidden", "text": "Cover the logo. It should still read as Zendesk: Licorice and white with one Matcha button, soft 40px cards, a warm photo of a person with a chat card." }, { "name": "Swap test", "text": "Put another service vendor's logo on it. If the Matcha-on-Licorice action, the Fern bands and the resolution story feel out of place, it is Zendesk enough; if not, it is generic." } ], "examples": [ { "chapter": "color", "do": { "ground": "paper", "text": "Try for free", "button": true, "button_fill": "#D1F470" }, "do_caption": "Matcha button with Licorice text: the accent marks the action.", "dont": { "ground": "paper", "text": "Resolve more, faster", "ink": "#D1F470" }, "dont_caption": "Matcha text on white has too little contrast; Matcha is a fill, not an ink." }, { "chapter": "voice", "do": { "ground": "paper", "text": "Faster resolutions. Stronger loyalty. Better outcomes." }, "do_caption": "Brief, focused, human: three short outcomes (homepage).", "dont": { "ground": "paper", "text": "Revolutionize your omnichannel CX with our best-in-class AI!" }, "dont_caption": "Jargon, hype and an exclamation mark." } ], "make_it_yours": { "note": "Everything above transfers. These are Zendesk's own and must be replaced with yours: name and logo, purpose, positioning, messaging pillars, proof, taglines and boilerplate.", "replace": [ "identity", "purpose", "positioning", "messaging.pillars", "messaging.proof_points", "messaging.taglines", "messaging.boilerplate" ], "reference": { "purpose": { "mission": { "text": "Simplify the complexity of business and make it easy for companies and customers to create connections (paraphrase).", "prov": "published", "source": "https://www.zendesk.com/company/" }, "story": { "text": "Zendesk was created to bring calm to the chaotic world of customer service; its About page jokes that it was born on a desk that was really a door, or a kitchen table (paraphrase). The 2025 brand refresh rebuilt the palette around Licorice, Coconut and Matcha, a tribute to the original Zendesk green.", "prov": "published", "source": "https://www.zendesk.com/company/", "also": [ "https://www.zendesk.com/company/brand-guidelines/" ], "paraphrase": true }, "values": [ { "name": "Everyone is a customer", "means": "Life is better when shared customer experiences are painless, frictionless and helpful (paraphrase of the About page).", "prov": "published", "source": "https://www.zendesk.com/company/" } ] }, "positioning": { "statement": { "text": "The AI-first service platform that resolves customer and employee issues faster, with AI agents that improve with every resolution.", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "category": { "text": "AI-first customer service platform (hero eyebrow: \"AI-powered customer service platform\")", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "audience": { "text": "Service leaders and teams, from startups to enterprises, across customer service, employee service (IT/HR) and contact centers.", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "problem": { "text": "Fragmented legacy stacks and AI tools that work in isolation, need constant retraining and leave teams handling repetitive work (paraphrase).", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" }, "promise": { "text": "Faster resolutions, stronger loyalty, better outcomes.", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, "differentiators": [ { "text": "AI trained on billions of real service interactions", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" }, { "text": "AI agents resolve end to end, with Copilot guiding human agents", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" }, { "text": "One platform for customers, employees, or both", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" }, { "text": "Governance built in: 99.9% uptime and major compliance certifications", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" } ], "alternatives": [ { "text": "Intercom, Salesforce and Freshdesk (the footer's Compare links)", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" } ] }, "messaging": { "taglines": [ { "text": "Automate up to 80% of interactions with Zendesk AI agents.", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "where": "homepage hero H1" }, { "text": "The only AI-first service platform", "prov": "observed", "source": "https://www.zendesk.com/company/brand-guidelines/ (site navigation, 2026-10-31)", "where": "platform description in the site navigation: \"the only AI-first service platform\" (paraphrased label)" } ], "attributes": [ "approachable", "modern", "trusted", "connected", "fresh" ], "key_messages": [], "boilerplate": { "text": "Zendesk is an AI-powered service platform built for the full service lifecycle, backed by 80,000+ customers and more than 19 years of expertise (paraphrase).", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/", "source_note": "2026-10-31", "paraphrase": true }, "pillars": [ { "name": "Resolution", "claim": "Every visual and word points at a problem resolved: the brand page frames its whole system around moving customers from challenge to resolution.", "prov": "published", "source": "https://www.zendesk.com/company/brand-guidelines/", "proof": [ "p-resolutions" ] }, { "name": "AI that learns", "claim": "AI agents improve with every resolution and can automate up to 80% of interactions.", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)", "proof": [ "p-80", "p-ai-customers" ] }, { "name": "Trusted at scale", "claim": "Security, governance and reliability for service leaders scaling AI.", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/", "proof": [ "p-uptime", "p-customers" ] }, { "name": "One platform", "claim": "One system for customer service, employee service and contact center, with no complex tooling.", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/", "proof": [ "p-customers" ] } ], "proof_points": [ { "id": "p-resolutions", "text": "4.8B resolutions delivered", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "p-80", "text": "Up to 80% of interactions automated by AI agents", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "p-ai-customers", "text": "22,000+ service teams use Zendesk AI", "prov": "observed", "source": "https://www.zendesk.com/ (2026-10-31)" }, { "id": "p-customers", "text": "80,000+ customers", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" }, { "id": "p-uptime", "text": "99.9% uptime; SOC 2, ISO 27001, CCPA and HIPAA compliance", "prov": "observed", "source": "https://www.zendesk.com/why-zendesk/" } ], "claim_boundaries": [ "Automation is always \"up to\" a percentage, never a guarantee (observed on the homepage and Why Zendesk)." ] } } } }