DocuSign Brand Identity Guidelines 2024
DocuSign Brand Identity Guidelines 2024 is the official identity system for DocuSign's rebrand into Intelligent Agreement Management, providing rules, assets, and governance for product and marketing teams.
Show all
It documents logo lockups, the Nexus icon, palette and gradients, DS Indigo, pictograms, photography, video/motion, product imagery, co‑branding, and accessibility guidelines. Includes a capitalization update (Docusign) and 102 practical examples
- Slide 1: DocuSign Brand Identity Guidelines
- Slide 2: Comprehensive table of contents listing Introduction, Brand Strategy, Logo, Color
- Slide 3: Section opener that signals the start of the guidelines
- Slide 4: Explains DocuSign's rebrand positioning and its move into the new
- Slide 5: States the rebrand's ambition to reinvent the company around
- Slide 6: Section header introducing the Brand Strategy chapter, which will define
- Slide 7: Breaks the brand into four questions: Who we
- Slide 8: Bringing Agreements to Life
- Slide 9: Creative Platform: Dynamic Connection
- Slide 10: Visual Principle 1: Connection
- Slide 11: Visual Principle 2: Dynamism
- Slide 12: Docusign Name: Capitalization Change
- Slide 13: Section opener marking the start of the Logo chapter
- Slide 14: The logo consists of the Nexus icon plus the wordmark
- Slide 15: The Nexus icon represents convergence:two shapes (a block
- Slide 16: The wordmark is based on the proprietary DS Indigo typeface
- Slide 17: Horizontal & Vertical Lockups
- Slide 18: Clear space is required around the wordmark and Nexus icon
- Slide 19: When a trademark symbol is needed alongside the logo, position
- Slide 20: Use the Docusign IAM lockup to highlight IAM capabilities
- Slide 21: Horizontal DocuSign logo may be locked with the tagline 'Bringing
- Slide 22: Six prohibited treatments: do not stretch the mark, separate
- Slide 23: Light and dark versions
- Slide 24: When full-color contrast is insufficient use the one-color lockup
- Slide 25: Avoid placing the full‑color mark on conflicting color fills
- Slide 26: Co-branded logos should sit next to or beneath the DocuSign
- Slide 27: Explains trademark and word mark rules: use DocuSign word marks
- Slide 28: Color: section divider
- Slide 29: Defines primary Cobalt and secondary colors (Inkwell, Deep Violet, White
- Slide 30: Recommends color weightings for consistent layouts with 2-, 3
- Slide 31: Recommended color pairings for text, graphic elements, and backgrounds
- Slide 32: Color applied to web and social layouts
- Slide 33: Color combinations in banners, cards, and social
- Slide 34: Accessibility: WCAG contrast guidance
- Slide 35: Color misuse: what to avoid
- Slide 36: Four approved gradients: Pearl, Atmosphere, Haze, Glow
- Slide 37: Light and dark theme guidance
- Slide 38: Section opener that visually introduces the chapter with oversized letterforms
- Slide 39: Introduces DS Indigo, DocuSign’s custom typeface for marketing and product
- Slide 40: Lists the six DS Indigo weights from Light to Bold
- Slide 41: Defines hierarchy for DS Indigo:use Indigo Light for display headlines
- Slide 42: Prescribes alignment, tracking, and leading: left align most text, set
- Slide 43: Recommends a line length of 50–75 characters per line
- Slide 44: Lists approved text/ color combinations that pass accessibility for large
- Slide 45: Identifies common mistakes to avoid:using inaccessible colors, setting paragraph text
- Slide 46: Advises Helvetica or Arial as simple sans‑serif fallbacks for technical
- Slide 47: Section opener introducing the Visual Elements chapter and the core
- Slide 48: Establishes basic geometric shapes (rounded circle, square, triangle, half‑circle, document)
- Slide 49: The Shape of Agreements
- Slide 50: Describes pictograms as simple, spot illustrations (not for UI controls)
- Slide 51: Build pictograms on a 32px grid (1:1), use brand colors
- Slide 52: Illustrations on an isometric grid
- Slide 53: Use overlapping geometry to express Connection and Dynamism:combine shapes
- Slide 54: Treat geometric intersections as fluid, outlined pattern elements that rotate
- Slide 55: Convey layered, opaque relationships with a glass-like effect: apply ~30px
- Slide 56: For larger illustrative art, build isometric geometric framings and apply
- Slide 57: Stack subtle, transparent geometric shapes to create layered textures
- Slide 58: Use brand colors (Cobalt, Inkwell, Mist, White), complementary accents, subtle
- Slide 59: Section introduction for product imagery that emphasizes device mockups
- Slide 60: Recommend three ways to depict the product:high-fidelity interfaces for demos
- Slide 61: Use literal, high‑fidelity UI screenshots that mirror the deployed product:include
- Slide 62: Abstract complex screens to highlight a single feature by enlarging
- Slide 63: Show real people using real devices with true, high‑fidelity on‑screen
- Slide 64: Prefer stylized device frames:thin gradient stroke with rounded corners
- Slide 65: Introduces the photography chapter and visual direction for brand imagery
- Slide 66: Photography principles: Connected, Natural, Inspired
- Slide 67: Portraits should be bright and natural with shallow depth
- Slide 68: Context, Industry, and Landscape
- Slide 69: Checklist of photo best practices: capture natural movement and posing
- Slide 70: Side‑by‑side Do/Don't examples showing approved photography (warm, saturated, candid, inclusive)
- Slide 71: Photo post‑production must deliver consistent grading with medium‑to‑high saturation, warmth
- Slide 72: The Nexus icon can act as a dynamic photo container:lower‑left
- Slide 73: Containers (center document mask)
- Slide 74: Use thin outline strokes (≈2pt) in Poppy, Poppy→Cobalt gradients, White
- Slide 75: Textured stroke outlines introduce color and texture at intersections
- Slide 76: Section divider introducing the Video & Motion guidelines and examples
- Slide 77: Video Foundations and Content
- Slide 78: Crafting content around our intent
- Slide 79: Platform guidance for video content
- Slide 80: Video art direction favors relatable, warm, lifestyle visuals: bright natural
- Slide 81: B-roll licensing and sourcing
- Slide 82: Grid and framing for video
- Slide 83: Lower thirds: name, pronouns, and role
- Slide 84: XL lower third for name emphasis
- Slide 85: Subtitle guidelines for accessibility
- Slide 86: Logo placements and final position
- Slide 87: Casting: inclusive and representative talent
- Slide 88: Wardrobe and accessories: do's and don'ts
- Slide 89: Appendix: Brand in Use
- Slide 90: Digital: app icon on mobile
- Slide 91: Social media profile icon and banner example
- Slide 92: Brand microsite on mobile
- Slide 93: DocuSign University splash page
- Slide 94: Intelligent Agreement Management landing page
- Slide 95: In-feed social media post variations
- Slide 96: Social media stories templates
- Slide 97: Rotating text headline treatment
- Slide 98: Vertical billboard out-of-home example
- Slide 99: Transit triptych poster set
- Slide 100: Transit broadside combines the headline 'Create, commit, and manage agreements'
- Slide 101: Vertical out-of-home banner with portrait creative
- Slide 102: Wide-format out-of-home mural billboard
Related decks
Fresh decks, weekly
A roundup of what's new in the gallery
