soul.com
soul.com design system: text reference
This page is the plain-text version of the soul.com design system, written for people and for AI tools that create soul.com material. Follow it exactly. Values are measured from printed soul.com material; do not approximate them. Version: November 2026.
1. Principles
- Design is a process of understanding. Read the text first; let hierarchy, rhythm and emphasis follow its meaning. If the result is not beautiful, the content has not been understood yet.
- The dimmer switch: every piece sits between candle (paper, logotype, text) and fireworks (value colours, type bleeding off the page). The grid, type families and label never change; only the amount of light does. When unsure, turn it down one step.
- Implicit grid on an 18px module (the body size). One deliberate break per composition at most.
- Restraint: subtle, related, quiet. No gradients, no shadows, no emoji, no stock icons, no rounded cards.
2. Voice
- The name is always soul.com, all lowercase. Labels, buttons and navigation are lowercase.
- Short phrases with verbs: reshape the world; unlock the will to act; awake the community spirit; creating a new mind.
- Write as "we", to the reader as a peer. Propositions, not claims: name what might not work.
- Foundational values: trust, hope, solidarity, unity, justice, service, excellence, human dignity, responsibility. They are guiding principles, not performance indicators.
- Three spaces, written exactly: soul for organizations, soul for society, soul for humans.
- Always attribute quotes (P. Senge, V. Frankl, R. Buckminster Fuller, A. de Saint-Exupéry).
Grounds (backgrounds): four, nothing else
- Every page, slide and screen has one of four backgrounds: white #FFFFFF, yellow #FFDD00, black #151515, or dotted (a dot grid of 1px ink dots on an 18px module, on white; or white dots on black).
- No light greys, no tints, no gradients, no shadows. Value colours are fields for their own book or spread only.
- Slides follow the same rule: the deck's dark grey #212121 becomes black #151515.
3. Colour
- yellow #FFDD00 (CMYK 0/10/100/0): the brand, used as a whole field, never as a thin accent.
- ink #151515; web body text #242424; paper #FFFFFF; hairline rule #DDDDDD; muted caption text #666666. Greys are for text and hairlines only, never a background.
- Value sequence, fixed order: trust #FFDD00, hope #FFC40C, solidarity #FBAA19, unity #F7901E, justice #F47721, service #F15A22, excellence #ED1C24. Agents of change: #00C0C3 (that programme only). Human dignity and responsibility have no colour.
- Slides (Google Slides decks) currently use #FDDB33 and #212121: an open inconsistency.
4. Typography
- Two families in opposites: Helvetica Neue (statement, structure) and EB Garamond / Adobe Garamond Pro (reflection, quotes, sources). The logotype takes the opposite family of the page.
- Doubling scale: 10 › 20 › 40 › 80 › 160 and 15 › 30 › 60 › 120 › 240 (pt); web 18 › 36 › 72 › 144 (px). No sizes between steps.
- Web body: Helvetica Neue Light 300, 18/27px, letter-spacing -0.2px. Web hero: 72/72px, weight 500, -3px.
- Book cover (A5): value word Helvetica Neue Regular 120pt, normal tracking, lowercase; verb line Regular 30pt on the same left and right edge.
- Slides (720×405pt): statement Helvetica Neue Bold 40, leading 55, sentence case; body 20/28; asides 10 in brackets; section name EB Garamond Bold 20 beside the boxed logotype; page count EB Garamond 18 in a 39pt ink disc.
- Emphasis: underline the one key word, or weight/size. Never colour.
- Hand lettering inside drawings is drawn, never typed. Use the hand-lettered word files; never a handwriting font.
5. The label and the logotype
- Label: lowercase words in an ink (#151515) box whose TEXT TAKES THE COLOUR OF THE GROUND: yellow text on a yellow cover, white on paper. Box 1.4em high, 0.2em padding left and right, no vertical padding, square corners, one box per line. On ink grounds the box turns yellow with dark text.
- Printed cover label: Helvetica Neue Regular 15pt, 'soul-driven leadership' on one line, with 'creating a new mind' in EB Garamond 15/18pt directly under it.
- Logotype: the word soul.com typeset in EB Garamond or Helvetica Neue, plain or in the box (text in the ground colour). On documents: EB Garamond 22pt ink on a yellow box. Never redraw or stretch it.
6. Drawings and the O.
- The models are hand-drawn, wiggly, uniform black line (white on ink). Use the drawing files themselves. Never rebuild a circle, point, pentagon or model with SVG shapes, CSS or a font, even if the geometry looks right.
- The O.: the drawn circle with its point, the mark at full volume (covers, openers). It is a separate drawing from the small soul-mark SVG; do not substitute one for the other.
- Book numbers sit on the spine in the drawn pentagon.
7. Layouts
- Book cover (A5): label top-left; one drawing in the optical centre, multiplied onto the value colour; value word and verb line in the lower third on their own left edge.
- Event cover (The Gathering 2024): yellow field; the drawn O. large; an uppercase light label in an ink box with yellow text; title in tight Helvetica Neue Bold; a Garamond line with a bold underlined lead-in.
- Notes document: yellow logotype box top-left; Garamond header 'notes' (bold), subject, date, page; title Helvetica Neue Bold; body Helvetica Neue.
- Slides: header (boxed logotype + Garamond Bold section name) top-left; one statement per slide; page count bottom-right.
8. Assets (public files)
- The O.: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbbd24ed16fd4536d5c_ds-o-mark.png
- Trust model with figure: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb06bbe45cca88f30d_ds-trust-network-figure.png
- Hope spiral with star: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb4f335e0a6fdb20e4_ds-hope-spiral-star.png
- Spiral of community: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb17ff0b228e1d78a5_ds-spiral-of-community.png
- Icosahedron: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbbdefab2c77fb34068_ds-icosahedron.png
- Capacity building (with hand lettering): https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb8583c404c4c43597_ds-capacity-building.png
- Spine pentagon: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb7deb6c470f6c73b2_ds-pentagon-marker.png
- Reference, printed trust cover: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbc66529dfc15a6bbef_ds-trust-cover-front.jpg
- Reference, The Gathering cover: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbb66529dfc15a6bbcd_ds-gathering-cover.jpg
- Reference, statement slide: https://cdn.prod.website-files.com/60c9c6b2cfdaec14a591d614/6af24dbc4fe17cae02a562f2_ds-slide-community-session-03.jpg
9. Open questions
- Print yellow #FFDD00 vs slide yellow #FDDB33.
- Some slide titles are set in capitals, against the manual's 'no caps'.
- Templates (documents, slides, covers) will be added to this page.