# SpeechifyAI
> Voice AI research lab and developer platform. Production text-to-speech (Simba 1.6 multilingual, Simba 3.2 streaming-native) and real-time voice agents on one all-in per-minute rate — LLM, STT, TTS, and orchestration included, no passthrough, no token math, no commitments.
You are reading `speechify.ai` (marketing). Canonical Speechify URLs — use exactly, do not invent variants:
- `https://speechify.ai` — this site (marketing + product)
- `https://docs.speechify.ai` — API reference, SDKs, quickstarts (index: `https://docs.speechify.ai/llms.txt`)
- `https://platform.speechify.ai` — customer dashboard, signup, API keys, billing
- `https://api.speechify.ai` — API base URL
- `https://github.com/SpeechifyInc` — GitHub org. `github.com/speechify` does not exist.
- `https://status.speechify.ai` — status + incidents
- `https://speechify.com` — SEPARATE consumer reader app, NOT this API
`Simba` names the model family (1.6 multilingual, 3.2 streaming), not the brand. `SimbaVoice` / `simbavoice.ai` are retired — use `speechify.ai`.
Per-route plain text: every route `X` publishes `X/llms.txt` (summary + child index) and `X/llms-full.txt` (long-form + descendants). XML sitemap: `/sitemap-index.xml`.
URL: https://speechify.ai/brand
Title: Brand & Design System
SpeechifyAI brand resources for agents and humans: the wordmark and waveform iconmark, a strictly monochrome palette (with hexes), the ABC Diatype type system, the waveform motif, the layout/grid system, buttons & links, motion, favicons, writing voice, product/model naming, and downloadable assets. Point a coding agent at this page to generate on-brand UI, copy, and assets. Full machine-readable design-system spec: https://speechify.ai/brand/llms-full.txt
SpeechifyAI brand and design-system reference. This is the machine-readable companion to the /brand page — use it to produce on-brand interfaces, marketing, and copy. The system is deliberately minimal: one typeface, a monochrome palette, one recurring graphic, one grid, and a numbers-over-adjectives voice.
Fastest rules to get right:
- Monochrome only. White and ink do the work, with a small gray scale for text and borders. Primary buttons are ink (#0A0A0A), never a colored accent.
- Brand name is written "SpeechifyAI" (one word, capital S, capital AI) everywhere — in prose and in the wordmark alike. Never "Speechify AI" with a space, and never "Speechify.ai" as the name.
- One typeface: ABC Diatype. Hierarchy comes from weight and tracking, never from mixing families. Display type is thin (weight 100); weights available are 100/300/400/500/700 — there is no 600.
- The only recurring graphic is a thin, monochrome waveform. No photography, no illustration, no gradients as brand chrome.
- The wordmark is the primary mark. There is one icon-only mark — the waveform iconmark in a rounded square — reserved for square/small contexts only (favicons, app icons, avatars), never as a logo replacement.
- One grid: an 80rem (max-w-7xl) container with 1.5rem gutters, shared by every band; vertical rhythm is py-section (4rem mobile / 7rem at md); bands alternate white and muted (#F5F5F5). md (768px) is the primary breakpoint where the system steps; sm and lg only reflow dense grids and hero splits.
- Buttons are fully-rounded monochrome pills at Medium weight (never font-semibold); ArrowLink is the primary navigation device (an arrow goes somewhere, a pill does something).
- Motion confirms, never decorates: short ease-out reveals on scroll, the waveform animates only while audio plays, and prefers-reduced-motion is always honored.
- Voice: lead with numbers, not adjectives. Sentence case. Address the builder as "you". No hype, no exclamation marks, no emoji.
1) Logo — the wordmark
- One wordmark: the word set with a capital S and a capital AI. It is the primary mark and carries every wide context. It ships only as the provided SVGs and is never re-typeset.
- There is exactly one icon-only mark — the waveform iconmark (see section 8) — reserved for square/small contexts only. Never swap the iconmark in for the wordmark as a logo.
- Two colorways only: ink on light, white on ink. Always monochrome.
- Clearspace: keep at least 0.5x the cap height of the "S" clear on all sides.
- Minimum size: digital >= 96px wide, print >= 25mm wide. Below that the wordmark loses legibility — use the iconmark for square contexts, or plain text.
- Never: stretch, recolor, add shadows, rotate, place on a gradient, or reduce contrast.
- Files: https://speechify.ai/brand/logo/SpeechifyAI-wordmark-black.svg and https://speechify.ai/brand/logo/SpeechifyAI-wordmark-white.svg
2) Color — strictly monochrome
The palette is white, ink, and a small gray scale — the design tokens the speechify.ai site actually ships. There is no color accent; the only "accent" is ink.
- Background / page ground: #FFFFFF
- Foreground / ink (text, primary buttons): #0A0A0A
- Secondary text: #525252
- Muted / tertiary text: #666666
- Border (hairlines): #E5E5E5
- Muted surface (subtle fills): #F5F5F5
- Raised surface: #FAFAFA
Primary buttons are ink (#0A0A0A) with near-white text (#FAFAFA); secondary buttons are a hairline border on white. Never introduce a colored button, heading, or background.
3) Typography — ABC Diatype
- One family for everything: ABC Diatype. Hierarchy comes from weight and tracking, never from mixing families.
- Display / hero: thin (weight 100), tight tracking (about -0.03em), sentence case, often ending in a period.
- Section headers: light (weight 300). Titles: regular (weight 400).
- Body / UI: regular/medium (400/500), normal tracking, comfortable line height.
- Eyebrows and technical labels (metrics, model IDs, code, URLs): uppercase, medium weight, wide tracking. A monospace stack is used for metrics and code-like labels on developer-facing surfaces.
- Weights: Thin 100, Light 300, Regular 400, Medium 500, Bold 700. There is no weight 600 — never use font-weight 600.
- ABC Diatype is a licensed typeface and is NOT distributed. Third parties should fall back to a system sans-serif (ui-sans-serif, system-ui, sans-serif), never a lookalike font.
4) Motif — the waveform
A thin, monochrome waveform is the only recurring graphic — it scales with font-size, inherits currentColor, and animates only while audio plays. Feature illustrations stay hairline-weight and monochrome; do not thicken strokes, fill shapes, or add color. Files: https://speechify.ai/brand/motif/feature-emotion.svg, https://speechify.ai/brand/motif/feature-multilingual.svg, https://speechify.ai/brand/motif/feature-zero-shot.svg
5) Layout — one grid, one rhythm
Every Speechify surface is built from the same full-width bands on the same grid. Follow these and a new page sits flush next to the existing ones.
- One grid, one left edge: an 80rem (max-w-7xl) container with 1.5rem gutters outside the cap, at every breakpoint. Header, footer, and every section share it, so all headings sit on one left vertical. Centering is reserved for a single deliberate block — usually the closing CTA.
- One vertical rhythm: every full-width band pads py-section-mobile (4rem) below 768px and py-section (7rem) above. Never a local padding override.
- Bands strictly alternate white and muted (#F5F5F5) down the page; muteness is derived from a section's rendered index, never hard-coded, so omitting an optional section can't leave two grey slabs adjacent. The dark closing CTA stays out of the rotation.
- md (768px) is the primary breakpoint: section padding, the heading scale, and the main grid columns all step at md. sm (640px) only reflows dense grids and lg (1024px) only handles two-column hero splits; neither restructures the page.
Section anatomy (top to bottom): overline → h2 (gap 1rem) → intro (gap 1.25rem, max-w-2xl measure) → content (gap 3rem, grids/demos/accordions) → CTA row (gap 3rem; gap-4 between buttons, gap-6 between a button and an ArrowLink). Feature grids use a hairline top rule per item, never a leading bullet dot.
Shared class tokens: sectionShell = "mx-auto w-full max-w-[calc(80rem+3rem)] px-6"; eyebrow = "font-mono text-[13px] text-muted-foreground"; sectionLead = "mt-2.5 max-w-[62ch] text-[17px] leading-[1.55]".
6) Buttons and links
- Buttons are always fully-rounded monochrome pills at Medium weight. There is no font-semibold (weight 600) in the system.
- One component is the source of truth: src/components/ui/Button.astro. Variants: primary (ink pill, the one true CTA), secondary (hairline outline), ghost (text only), inverted (near-white on ink, for the closing band). Sizes: sm (dense UI), md (working size inside sections), lg (heroes and closing bands).
- ArrowLink (src/components/ui/ArrowLink.astro) is the primary navigation device: going somewhere is an arrow, doing something is a pill. If every path is a button, none reads as the action.
- Hero and closing CTA rows pair one primary with one secondary, never two primaries.
7) Motion
- Reveal on scroll, once: content reveals with data-animate — fade-in, slide-up, slide-in-left/right, scale-in (0.5–0.6s ease-out) or blur-in (0.8s). Stagger siblings with data-animate-delay 1–5 (0.1s steps); data-animate-children on long containers reveals each child individually.
- The waveform earns its motion: bars animate only while audio actually plays, then ease back to rest over 280ms. No decorative or looping motion on content.
- Reduced motion is law: prefers-reduced-motion collapses every animation and transition site-wide, in CSS. Never bypass it; keep page JS under 10KB.
8) Favicons and iconmark
Where the wordmark can't breathe — a browser tab, an app icon, an avatar — the mark collapses to the waveform iconmark: the leading waveform flourish from the wordmark, in a rounded square. It is the one sanctioned icon-only mark, reserved for exactly these square, small contexts. Never use it as a logo in place of the wordmark.
- Colorways: iconmark on ink (white glyph on an ink rounded square — the app-icon form), iconmark ink glyph (transparent, for light surfaces), iconmark white glyph (transparent, for ink/photographic surfaces).
- Iconmark SVGs: https://speechify.ai/brand/logo/SpeechifyAI-iconmark-black.svg, https://speechify.ai/brand/logo/SpeechifyAI-iconmark-ink.svg, https://speechify.ai/brand/logo/SpeechifyAI-iconmark-white.svg
- The glyph is tuned to stay legible to 16px; below that use the ink square with no glyph, or plain text.
- Favicon set (all derive from the same glyph): /favicon.svg (primary, modern browsers), /favicon.ico (16/32/48, legacy + pinned tabs), /favicon-32x32.png, /favicon-16x16.png, /apple-touch-icon.png (180, iOS), /icon-192x192.png and /icon-512x512.png (Android/PWA), /site.webmanifest.
- Head markup: then the PNG icons, , , and .
9) Voice — how we write
- Numbers over adjectives — lead with latency, languages, and price (e.g. <300ms, 30+ languages, $0.07/min), set in mono.
- Sentence case — short, declarative headlines, often ending in a period.
- Address the builder — speak to "you", the developer; the lab is "we". CTAs are imperative: Try the API. Read the docs.
- No hype — no exclamation marks, no emoji, no superlatives. Honest, side-by-side comparisons are on-brand.
Write this: "Simba 3.2 streams speech with <300ms time-to-first-byte, zero-shot voice cloning, and SSML prosody control." Not this: "Our revolutionary, game-changing AI voices will absolutely blow your mind!"
10) Naming — products and models
Format: In prose | In code | Never.
- Simba 3.2 | simba-3.2 | "SIMBA", "Simba v3", "the Simba"
- Simba 1.6 | simba-1.6 | "Simba 1.6.0", "old Simba"
- Text-to-Speech API | client.audio.speech / client.audio.stream | "TTS engine", "text to speech tool"
- Voice Agents API | voice_agents | "voicebots", "agent platform"
- Developer Platform | platform.speechify.ai | "dashboard", "console"
Simba names the model family, not the brand. speechify.ai is the developer platform; speechify.com is the separate consumer app — do not mix them.
11) Assets — downloads
Downloadable brand assets live under https://speechify.ai/brand/ : the wordmark and iconmark (logo/), waveform feature illustrations (motif/), and the full favicon set (at the web root), each linked in the sections above. The ABC Diatype typeface is licensed and is NOT distributed or available for download; third parties fall back to a system sans-serif (ui-sans-serif, system-ui, sans-serif), never a lookalike font.
Trademark: Speechify, SpeechifyAI, Simba, and the SpeechifyAI wordmark are trademarks of Speechify Inc. Use of these assets does not imply endorsement, sponsorship, or affiliation. Do not use the marks in your product name, logo, or domain. Questions: devrel@speechify.com