--- name: Ideal State slug: ideal-state version: 1.0.0 lastUpdated: 2017-09-21 canonicalUrl: /brand/ideal-state --- # Ideal State Brand Spec > A civic-technology consultancy designing knowledge architecture for organizations driving systemic change. The brand reads as a literal pronunciation key. /īdē[ə]l/stāt/. A filepath. A pause. A pivot from current state to ideal state. This is the agent-optimized brand spec. It mixes the human-authored brand book with structured sections from the JSON tokens. Use it to author on-brand copy, generate assets, or wire tokens into a client repo. ## How to use this spec If you are an AI agent (Cursor, Claude Code, ChatGPT, internal Workhorse session agent, or other) generating copy or assets for this brand, treat this document as canonical: 1. **Read the Voice section first.** Tone words, guidelines, banned terms, preferred terms. 2. **Match the surface.** When you write a hero, CTA, newsletter intro, social caption, press quote, or any other surface, find that surface under "Surface do/don't" and follow the do/don't pattern explicitly. 3. **Call prompts by id.** When the user asks for something that maps to a `promptKit` entry (e.g. `newsletter-intro`, `hero-line`, `agency-pitch`), use that prompt's template structure and example output. 4. **Cite the spec.** When you produce on-brand copy, end with a short footer like `(brand · v1.0.0)`. 5. **Never use banned terms.** Prefer `preferredTerms`. The list at the bottom of the Voice section is opinionated for a reason. 6. **Spec.json is also available.** Same content, structured as JSON, at `/brand/ideal-state/spec.json`. Use it when you need programmatic access to a specific section. --- ## Foundation **Position.** Knowledge architects for social-change organizations. **Tagline.** Change is the new status quo. **Homepage line.** Change is the new status quo. **Descriptor.** Knowledge architecture for organizations driving systemic change. **Value proposition.** Ideal State helped organizations working toward social change design and build the knowledge ecosystems that connected their people, process, and technology. Practice and theory delivered together. **Origin.** Founded in 2016 as a civic-technology consultancy. The name reads as a literal pronunciation key. /īdē[ə]l/stāt/. The slash before /State is both a filepath separator and a transition mark from current state to ideal state. The brand carries the discipline of a system reference and the warmth of a stamp on letterhead. ## Heritage ### Change is the new status quo. *Knowledge architecture for organizations driving systemic change.* Ideal State designed knowledge ecosystems for organizations working on social change. Practice and theory delivered together. *Brand Identity Guidelines* ### An ideal state is a destination. **/īdē[ə]l/stāt/.** The brand begins as a pronunciation key. A slash. A bar over the I. A bracket holding the syllables together. Read literally it is the phonetic spelling of the practice's name. Read as a system reference it is a filepath from the current state to the ideal one. Read as a stamp on a white-paper cover it is the practice's signature. ### Founded in 2016. The practice opened to design knowledge architectures for organizations working on systemic change. The starting bet: a thriving knowledge ecosystem is one that combines people, process, and technology to redefine how people work together and achieve maximum impact. The 2017 brand system carried that bet through. A pronunciation-key logotype. A Cartograph type pairing. A topographic ground. Four sub-brands written as filepaths. Templates for the documents the practice actually shipped. ### Background Ideal State worked with mission-driven organizations on the harder half of digital transformation: turning a stack of tools, files, and teams into a single working knowledge system. The brand carried that practice through identity, sub-brands, and the document templates the work actually shipped on. ### Brand character > Plainspoken. Ambitious. Warm. **Holistic** · **Practical** · **Empowering** · **Ambitious** · **Heartfelt** · **Human-centered** ### Brand pillars #### undefined #### undefined #### undefined #### undefined ## Audience ## Voice **Tone:** Plainspoken, Ambitious, Warm ## Color | Token | Hex | Role | Notes | |---|---|---|---| | `warm.tangerine` | `#ee5927` | | Tangerine. Primary brand color. C:1 M:80 Y:97 K:0 | | `warm.brick` | `#a13423` | | Brick. Secondary warm. C:25 M:91 Y:99 K:19 | | `warm.salmon` | `#ed9484` | | Salmon. Soft warm. C:3 M:50 Y:42 K:0 | | `cool.navy` | `#05152C` | | Navy. Deepest cool. C:93 M:82 Y:51 K:65 | | `cool.royal` | `#263d90` | | Royal Blue. Secondary brand color. C:0 M:92 Y:7 K:0 | | `cool.periwinkle` | `#8092c9` | | Periwinkle. Soft cool. C:51 M:38 Y:0 K:0 | | `neutral.slate` | `#323232` | | Slate. Body type and grayscale logo. C:0 M:0 Y:0 K:95 | | `neutral.graphite` | `#585858` | | Graphite. Secondary type. C:0 M:0 Y:0 K:80 | | `neutral.fog` | `#dcdcdc` | | Fog. Light backgrounds, rules, dividers. C:0 M:0 Y:0 K:10 | | `white` | `#FFFFFF` | | White | ## Typography ### Families - **Cartograph Sans CF** (`primary`): 'Cartograph Sans CF', 'JetBrains Mono', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif *Cartograph Sans CF (Connary Fagen). The brand's workhorse face. Headlines, body, labels.* - **Cartograph Mono CF** (`mono`): 'Cartograph Mono CF', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace *Cartograph Mono CF. Captions, kickers, version stamps, and the path-notation logotype itself.* ### Scale | Token | Value | Use | |---|---|---| | `display` | `4.300rem` | 69px. Display headlines | | `h1` | `3.583rem` | 57px. Hero / page title | | `h2` | `2.986rem` | 48px. Section headline | | `h3` | `2.488rem` | 40px. Sub-section | | `h4` | `2.074rem` | 33px. Card heading | | `h5` | `1.728rem` | 28px. Small heading | | `h6` | `1.440rem` | 23px. Eyebrow / kicker | | `lead` | `1.200rem` | 19px. Lede | | `body` | `1.000rem` | 16px. Default body | | `small` | `0.833rem` | 13px. Secondary text | | `xs` | `0.694rem` | 11px. Labels, meta | ## Logo ### Stacked Logotype The primary logo. Two-line stack: Ideal / State. Use for the largest and most recognizable applications. Reads as the visual pronunciation key. - **Stacked, Tangerine on White**: `/media/ideal-state/logo/lockup-04.png` - **Stacked, Reverse on Tangerine**: `/media/ideal-state/logo/lockup-01.png` - **Stacked, Reverse on Slate**: `/media/ideal-state/logo/lockup-07.png` - **Stacked, One Color on White**: `/media/ideal-state/logo/lockup-14.png` ### Horizontal Logotype The secondary lockup. One-line wordmark for narrow headers, business-card chips, and any application where the stacked mark would crowd the layout. - **Horizontal, Tangerine on White**: `/media/ideal-state/logo/lockup-11.png` - **Horizontal, Reverse on Tangerine**: `/media/ideal-state/logo/lockup-10.png` - **Horizontal, Reverse on Slate**: `/media/ideal-state/logo/lockup-12.png` - **Horizontal, One Color on White**: `/media/ideal-state/logo/lockup-17.png` ### ID Monogram The small-format mark. A bracketed 'Id' for favicons, app icons, business-card backs, and any spot under 50px where the wordmark would lose detail. - **Monogram, Tangerine on White**: `/media/ideal-state/logo/lockup-05.png` - **Monogram, Reverse on Tangerine**: `/media/ideal-state/logo/lockup-02.png` - **Monogram, Reverse on Slate**: `/media/ideal-state/logo/lockup-08.png` - **Monogram, One Color on White**: `/media/ideal-state/logo/lockup-15.png` ### Bracketed Mark The alternate badge. Stacked logotype inside the bracket-box used for the monogram. Substitutes for the stacked lockup on darker collateral, posters, and merchandise stamps. - **Bracketed, Tangerine on White**: `/media/ideal-state/logo/lockup-06.png` - **Bracketed, Reverse on Tangerine**: `/media/ideal-state/logo/lockup-03.png` - **Bracketed, Reverse on Slate**: `/media/ideal-state/logo/lockup-09.png` - **Bracketed, One Color on White**: `/media/ideal-state/logo/lockup-16.png` ## Imagery **Principles.** - Linework before color. The grammar is set in monoweight outline. Color enters when the surface needs more energy. - The topographic ground does the talking. Resist adding more pattern on top of it. - Illustration is part of the system, not decoration. Use it to describe an architecture, not to fill a page. ## Sub-brands ### Ideal/Knowledge (`ideal-knowledge`) *Service area · shipped* The knowledge-architecture practice. Information design, taxonomy work, content systems. ### Ideal/Community (`ideal-community`) *Service area · shipped* The community + collaboration practice. Stakeholder engagement, focus groups, user stories. ### Ideal/Events (`ideal-events`) *Service area · shipped* The convening practice. Workshops, training sessions, strategy sprints. ### Ideal/Systems (`ideal-systems`) *Service area · shipped* The technology practice. Intranet, extranet, and digital tools that hold the knowledge architecture together. ### Ideal/Process (`ideal-process`) *Program · shipped* ID_COURSE.01. The process program. How the practice is run. ### Ideal/Research (`ideal-research`) *Program · shipped* ID_COURSE.02. The research program. How the studio listens before designing. ### Ideal/Mindset (`ideal-mindset`) *Program · shipped* ID_COURSE.03. The mindset program. How the studio teaches the orientation that makes the rest possible. ## Applications ### Business Identity Set (`print`) Business cards with the tangerine block + horizontal logotype on the face, square ID monogram on the back. Letterhead in the same system with the stacked logotype anchored top-left. ### White Paper Template (`print`) Full white-paper series template. Topographic royal-blue cover, sub-brand mark on the cover (Ideal/Community, Ideal/Knowledge, etc.), tangerine accents on numbered process steps and pull-quotes, modular interior grid for stories + sidebars. ### Presentation Template (`digital`) PowerPoint master template with topographic chapter dividers, the brand's tangerine accent rules, and the secondary illustration set for section openers. ### One-sheet Handout (`print`) Tri-fold handout summarizing the practice. Front cover: topographic ground + 'Change is the new status quo'. Interior: the four-pillar ecosystem diagram, services list, contact panel. ### Design Process Map (`internal`) Internal-facing process diagram (Build / Human-Centered Design / Workspace). Used inside the studio and on engagement kickoff decks to set expectations for the way the practice works. --- ## Brand Book (human-authored prose) # Ideal State Brand Book Knowledge architecture for organizations driving systemic change. Founded 2016. Brand system delivered September 2017. This is the prose brand book. It sits alongside the machine-generated `build/spec.md` (assembled from the JSON token files) and mirrors the canonical 2017 brand guidelines (Workhorse delivery, file `wrkhrsco-Ideal_state`). The brand is archived. The system below is the system as delivered. --- ## Foundation **Change is the new status quo.** Ideal State designed knowledge ecosystems for organizations working on systemic change. Practice and theory delivered together. ### Mission Help organizations build the global knowledge architecture needed to drive systemic transformation in the areas of people, process, and technology. ### Vision Harness the power of human connection to make the world a better place. ### Origin Founded in 2016 to design knowledge architectures for organizations working on systemic change. The starting bet was that a thriving knowledge ecosystem combines people, process, and technology to redefine how people work together and achieve maximum impact. The 2017 brand system carried that bet through identity, sub-brands, and the document templates the practice actually shipped on. --- ## Brand Character Plainspoken. Ambitious. Warm. **Holistic. Practical. Empowering. Ambitious. Heartfelt. Human-centered.** > Design is so simple, that is why it is so complicated. > — Paul Rand --- ## Brand Values 1. **Experience matters.** Designing complex systems is no easy task. The collective expertise navigates the course. 2. **Let's build a better world.** Social change is no small order. Think ambitiously, won't stop short of getting there. Together is better. 3. **We work with you, not just for you.** Empower clients with the knowledge and tools they need to succeed on their own. 4. **Work hard, with heart.** Take the work seriously, have a good time while doing it. Wholehearted belief in the practice. 5. **Think holistically.** Start with the big picture. Only then can a system be truly effective for the team using it. 6. **People first.** The power of human-centered design. Get that right, and everything else follows. --- ## Brand Pillars The practice and the brand both run on the same four-pillar ecosystem. **Strategy** — Hold the room. The outer frame. Strategy holds the other three pillars together and decides what the system is for. **Community & Collaboration** — People and the room they work in. Stakeholder alignment, focus groups, user stories, and the working agreements that keep an organization moving in the same direction. **Content** — The artifacts the work produces. Documents, knowledge bases, and the everyday surfaces a team produces and reads inside the system. **Data** — The measures and the loops. Reporting, dashboards, and the feedback loops that keep the system honest. --- ## Color A warm signal in a cool field. Tangerine over royal blue. Practice over theory. The palette runs on two registers. Tangerine carries the energy. Royal blue carries the institutional weight. The two halves talk to each other across every surface, which is how a knowledge architecture is supposed to behave. | Token | Hex | CMYK | |-------|-----|------| | Tangerine | `#ee5927` | 1 / 80 / 97 / 0 | | Brick | `#a13423` | 25 / 91 / 99 / 19 | | Salmon | `#ed9484` | 3 / 50 / 42 / 0 | | Navy | `#05152C` | 93 / 82 / 51 / 65 | | Royal Blue | `#263d90` | 0 / 92 / 7 / 0 | | Periwinkle | `#8092c9` | 51 / 38 / 0 / 0 | | Slate | `#323232` | 0 / 0 / 0 / 95 | | Graphite | `#585858` | 0 / 0 / 0 / 80 | | Fog | `#dcdcdc` | 0 / 0 / 0 / 10 | | White | `#FFFFFF` | 0 / 0 / 0 / 0 | --- ## Typography One family. Two registers. Cartograph Sans CF and Cartograph Mono CF (Connary Fagen Type Foundry). Cartograph is a humanist family with a shared mono skeleton. The sans cut runs as the workhorse face. The mono cut handles captions, kickers, code, and any moment where the type should feel like a printed label. Pairing them keeps the brand on a single typographic key without going monotone. - **Cartograph Sans CF.** Headlines, body, eyebrows, navigation. - **Cartograph Mono CF.** Captions, labels, kicker eyebrows, and the path-notation logotype itself. --- ## Logo A pronunciation key. A filepath. A pivot. The primary logotype is the brand name set inside the brackets of phonetic notation. The macron over the I marks the long "ī". The slash before /State both separates syllables and behaves as a filepath. Read together they form the visual pronunciation: /īdē[ə]l/stāt/. Four marks documented: - **Stacked logotype.** The primary mark. Two-line stack. - **Horizontal logotype.** The secondary mark. One-line wordmark for narrow headers. - **ID monogram.** The small-format mark. A bracketed "Id" for favicons and any spot under 50px. - **Bracketed mark.** The alternate badge. Stacked logotype inside the bracket-box. Clearspace equals the length of the logo's top dash. Minimum size is 100px or 1 inch wide for the stacked or horizontal logotype. Under 50px, use the ID monogram instead. --- ## Sub-brands One mark. Many directories. The sub-brand system extends the primary mark by changing only what follows the slash. The bracket-box wrapper holds the family together. **Service areas.** - **Ideal/Knowledge.** Knowledge-architecture practice. Information design, taxonomy, content systems. - **Ideal/Community.** Community + collaboration. Stakeholder engagement, focus groups. - **Ideal/Events.** Convening. Workshops, training, strategy sprints. - **Ideal/Systems.** Technology. Intranet, extranet, digital tools. **Programs.** - **Ideal/Process.** ID_COURSE.01. How the practice is run. - **Ideal/Research.** ID_COURSE.02. How the studio listens before designing. - **Ideal/Mindset.** ID_COURSE.03. How the studio teaches the orientation that makes the rest possible. --- ## Imagery Two illustration registers. One signature texture. **Primary illustrations.** Monoweight outline, tangerine on white. Ambient line work composed of small icons (charts, brains, lightbulbs, documents) arranged as a knowledge landscape. Use for section openers, marketing modules, and white-paper interiors. **Secondary illustrations.** Figurative posters on the topographic blue ground. Solid color blocking, narrative scenes. Use for social posts, posters, and presentation chapter dividers. **Topographic texture.** Contour-line ground. Cartographic by reference and by name. Two colorways: royal-blue for institutional moments, tangerine for warm moments. Three principles: - Linework before color. Color enters when the surface needs more energy. - The topographic ground does the talking. Resist adding more pattern on top of it. - Illustration is part of the system, not decoration. Use it to describe an architecture. --- ## Applications The brand system shipped against the practice's actual production surface. - **Business identity set.** Cards (tangerine block face + ID monogram back), letterhead. - **White paper template.** Royal-blue topographic cover with sub-brand mark on the cover; modular interior grid for stories + sidebars. - **Presentation template.** PowerPoint master with topographic chapter dividers and secondary illustration set. - **One-sheet handout.** Tri-fold summarizing the practice. - **Design process map.** Internal-facing process diagram (Build / HCD / Workspace). --- ## Stewardship Ideal State is in the studio archive. This brand book is the canonical record of the system as delivered, mirrored from the September 2017 brand guidelines. It versions in git and exposes a machine-readable spec at `/brand/ideal-state/spec.json` for AI ingestion.