SpeechifyAI brand resources.
Everything you need to represent SpeechifyAI correctly — logos, colors, type, the waveform motif, and how we write. Assets on this page are free to use when covering or integrating with SpeechifyAI.
The wordmark
SpeechifyAI is set as a single wordmark — one word, capital S, capital AI. It is always monochrome: ink on light backgrounds, white on ink, and it ships only as the SVGs below — never re-typeset. The wordmark is the primary mark and carries every wide context; a companion iconmark (the waveform in a rounded square) is reserved for square and small contexts only — favicons, app icons, and avatars — where the wordmark can't breathe.
0.5× 0.5× Keep clearspace of at least half the cap height of the "S" on all sides. Nothing enters this zone — not text, rules, or other marks.
Below minimum size the wordmark loses legibility. If the mark must go smaller, use the iconmark for square contexts, or plain text.
Don't do this
The wordmark ships in exactly two colorways. Everything else is off-brand.
Strictly monochrome
White and ink do everything, with a small gray scale for text and borders. The only "accent" is ink — primary buttons are ink, never colored. These are the exact design tokens the speechify.ai site ships. Click any swatch to copy its hex.
There is no color in the system — no colored buttons, headings, or backgrounds. Hierarchy and emphasis come from the gray scale and weight alone.
One family: ABC Diatype
ABC Diatype drives every role — display, body, and technical labels. Hierarchy comes from weight and tracking, not from mixing families.
from humans.
Headlines and heroes. Regular (400), tight tracking (about -0.03em), sentence case, often ending in a period.
Paragraphs, UI labels, and controls. Regular and Medium, normal tracking, comfortable line height.
Eyebrows, metrics, model IDs, and code — a brand signal, used liberally. Uppercase eyebrows with wide tracking.
ABC Diatype is a licensed typeface and is not distributed. Third parties should fall back to a system sans-serif (the CSS stack is ui-sans-serif, system-ui, sans-serif), never a lookalike font.
The waveform
Our only recurring graphic is a thin, monochrome waveform — the sound of the product. No photography, no illustration, no gradients.
One grid, one rhythm
Every Speechify page is built from the same full-width bands on the same grid. The rules are few and strict — follow them and a new page sits flush next to /models and /pricing.
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.
Every full-width band pads py-section-mobile (4rem) below 768px and py-section (7rem) above. Never a local padding override — one page on a tighter rhythm is the single most visible way a page reads as off-system. A tighter band is a card inside a normal section.
Section backgrounds alternate white and muted (#F5F5F5) down the page. Because sections are optional, muteness is derived from a section's index in the rendered order — never hard-coded — so omitting one can't leave two grey slabs adjacent. The dark closing CTA stays out of the rotation.
768px is where the system steps: section padding, the heading scale, and the main grid columns all change at md. sm (640px) only reflows dense grids and lg (1024px) only handles two-column hero splits — neither restructures the page. Reach past md sparingly.
Inside a section
The internal rhythm is as canonical as the bands. Feature grids use a hairline top rule per item — never a leading bullet dot.
The tokens this page uses
Not a spec in the abstract — these are the exact class strings every band on this page is composed from. Copy them to build a matching surface.
Crisp and restrained
Motion confirms, it never decorates. Short ease-out reveals on scroll, and one living element — the waveform — that moves only when sound does.
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).
Waveform bars animate only while audio actually plays, then ease back to rest over 280ms. No decorative or looping motion on content.
prefers-reduced-motion collapses every animation and transition site-wide, in CSS. Never bypass it, and keep page JS under 10KB.
data-animate="fade-in | slide-up | slide-in-left | slide-in-right | scale-in | blur-in"
data-animate-delay="1…5" · 0.1s steps ·
data-animate-children="…" for long containers whose children reveal individually
The waveform iconmark
Where the wordmark can't breathe — a browser tab, an app icon, an avatar — the mark collapses to a single glyph: the leading waveform flourish from the wordmark, in a rounded square. It is the one sanctioned icon-only mark, and it is reserved for exactly these square, small contexts. Never use it as a logo in place of the wordmark.
The glyph is tuned to stay legible down to 16px. Below that, the waveform detail muddies — reach for the ink square with no glyph, or plain text, instead.
The favicon set
Every file below is wired into the site head and derives from the same glyph. Drop the whole set at your web root and reference it exactly as this site does.
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="manifest" href="/site.webmanifest" />
How we write
Research-lab confidence, engineering clarity. Lead with capability and numbers, not adjectives.
Lead with latency, languages, and price — <300ms, 30+ languages, $0.07/min — set in mono.
Headings and body in sentence case. Short, declarative headlines, often ending in a period.
Speak to "you", the developer; the lab is "we". CTAs are imperative: Try the API. Read the docs.
No exclamation marks, no emoji, no superlatives. Honest, side-by-side comparisons are on-brand.
"Simba 3.2 streams speech with <300ms time-to-first-byte, zero-shot voice cloning, and SSML prosody control."
"Our revolutionary, game-changing AI voices will absolutely blow your mind!"
Products & models
Product names are proper nouns in sentence case copy. API identifiers stay lowercase and monospaced.
The brand is written "SpeechifyAI" — one word, capital S, capital AI — in prose and in the wordmark alike. Never "Speechify AI" with a space, and never "Speechify.ai" as the name. The developer platform is speechify.ai; the consumer app is speechify.com — don't mix them.
Downloads
Every asset on this page, in one place.
Structured brand specifications
This page is also published as machine-readable plain text. Point your coding agent at speechify.ai/brand/llms.txt (or /brand/llms-full.txt for the full spec) and it will know these rules — logo, color, type, motif, voice, and naming — without a human in the loop.
Questions about usage?
For press inquiries, co-branding, or anything not covered here, write to devrel@speechify.com.
Contact usSpeechify, SpeechifyAI, Simba, and the SpeechifyAI wordmark are trademarks of Speechify Inc. Use of these assets does not imply endorsement, sponsorship, or affiliation. Don't use the marks in your product name, logo, or domain.