Brand and voice guide

How VoiceClaw looks, sounds, and behaves.

One reference for every VoiceClaw surface: the website, the trade-show banners, the LinkedIn page, the product, and any app that comes next. Every value here is lifted from what is already live, so following this guide keeps new work matching old work.

Version 1, written 2026-09-11 Sources voiceclaw.ca, trade-show sketches, LinkedIn cover, the product one-liner Owner Ian Pilon

Essence

Before any colour or word: what VoiceClaw is, who it is for, and the one idea everything hangs on.

What it is

A managed business memory you can talk to. Ask about any asset, customer, or job and get an answer by voice or text instead of chasing people.

That sentence is final. Use it verbatim as the product description everywhere: hero, LinkedIn About, decks, proposals.

Who it is for

Owner-operators who are the filing system. They own and run a business with a crew of five to fifty that services, rents, leases, or maintains physical things. Their records live in three or more places, and one of those places is a person.

The one idea

The answers were buried. We did the digging. The data was never easy to get. It was scattered across old software, texts, PDFs, and people's heads, and we clawed it out. Now every answer is a question away.

"Claw" is a deliberate brand plant. Use it as a verb ("clawed out of a legacy system") when the point is that we did hard work nobody else would.

Three positioning lines

A managed service, not software. We build it, we run it, you ask it.

A layer, not a replacement. Everything they already run stays.

Memory, not reception. It answers the owner. It does not answer the phone.

Colour

Dark first, always. Deep navy surfaces, one electric cyan accent, and nothing warm. Elevation comes from a lighter surface, never from a heavier border.

Ground and surfaces
Ground#0d1126Page background. Every VoiceClaw surface starts here.
Surface#141936Panels, code blocks, the phone screen's ground.
Raised#1a2040Inputs, answer bubbles, anything that sits on a surface.
Lift#1c2350Only as a radial gradient behind a hero, fading to transparent.
Linergba(138,147,184,.18)The only border colour. Use it sparingly.
Ink
Ink#f3f5ffHeadlines, primary text, the logo.
Ink 2#c9cee6Lead paragraphs, body text on long pages, ghost buttons.
Muted#8a93b8Labels, captions, placeholders, the quietest text.
The accent
Cyan#22d3eeThe one accent. Highlighted phrase, primary button, dots, numerals, glow.
Accent ink#06202aText on a cyan fill. Never white on cyan.
Glowrgba(34,211,238,.45)Text shadow and box shadow colour. Soft version at .12 for focus rings.
▲ +1%  ▼ -3%
Up / down#34d399 / #f87171Only next to a number. Never a field, never a button.
Orange#f5511dTried on the trade-show banner and rejected. Warm accents are out.

One accent per surface. Cyan is it. If a page needs a second emphasis colour, the hierarchy is wrong, not the palette.

No light theme. VoiceClaw is dark only. Paint the ground explicitly on every surface so it holds on any host.

Type

Inter everywhere. Headlines are medium weight and tight. Numbers get the stage at light weight. Labels stay small, uppercase, and spaced.

Headline500 · clamp(38px,6vw,68px) · 1.02 · -.025em

A managed business memory you can talk to.

Section title500 · clamp(28px,4vw,42px) · 1.08 · -.025em

Still chasing people for answers?

Subhead500 · 20px · -.01em

Owner-operators who are the filing system.

Lead400 · clamp(18px,2vw,21px) · ink 2

Ask about any asset, customer, or job and get an answer by voice or text instead of chasing people.

Body400 · 17px · 1.55

If you own a small operation, you are the filing system. The answer to almost any question is in a text thread, a spreadsheet, a PDF in Dropbox, or the head of whoever did the job.

Kicker500 · 12px · .16em · uppercase · cyan
For owner-operators
Label400 · 11.5px · .08em · uppercase · muted
Open work orders · last week
Numeral300 · 44px · -.03em · cyan + glow
3 open

The highlighted phrase. One phrase per headline turns cyan with a glow: the payoff word, not the subject. "talk to." "answers?" "behaves." Never two phrases, never a whole line.

Weight rules. 500 for headings and buttons, 400 for text, 300 for big numbers only. Nothing bold. Emphasis comes from colour and size, not weight.

Glow and depth

Glow is the signature. It marks what is live, what is the answer, and what matters. Depth comes from surface lightness and soft shadows, not from lines.

$18,200 a question away Book a 20-minute call

Three glow recipes cover everything: text-shadow for a phrase or numeral, box-shadow for a dot, and a ring at the soft glow value for a focused or hovered input.

/* phrase or numeral */
color: var(--vc-accent);
text-shadow: 0 0 26px var(--vc-glow);
/* live dot, bullet, mic */
background: var(--vc-accent);
box-shadow: 0 0 10px 2px var(--vc-glow);
/* focus or hover ring */
border-color: var(--vc-accent);
box-shadow: 0 0 0 3px var(--vc-glow-soft);

Shadows are soft and large. The phone panel uses 0 32px 64px -24px rgba(0,0,0,.75). A hovered primary button lifts one pixel and casts 0 10px 30px -10px of glow. No hard edges, no 1 px borders on everything.

The hero lift. Behind a hero, a radial gradient of Lift at the top-left corner fading to nothing. It reads as a light source, not a decoration. Once per page.

Components

The pieces that already exist, rendered live from the tokens file. Reuse them before inventing anything.

Buttons
Book a 20-minute call See how it works We run it for you. Nothing to install, nothing to replace.

Pills, always. One primary per view. The ghost button is a line, never a fill. A small muted line under the buttons carries the reassurance.

The answer
What did we quote them last time?
checked · quotes + email
Henderson Farms · quote, Mar 3$4,850Reefer service, two units, parts included. Sent by email, never signed. Sandy can resend it.

Anatomy of an answer. A question in cyan. A lookup chip that names where it looked. Then the answer: a small label naming the record, one big light number or state, and one sentence of detail with a name and a date in it.

The big value is the answer. The sentence is the proof. Together they let the owner check it without opening anything.

Composer

One pill input with a glowing mic dot. The placeholder is a real question, never "Type here". On the site it cycles a suggested question every 4.2 seconds and sends it on tap.

Steps and lists
1

We pull it out

We connect to the systems you already run and get the data out, including the old software nobody can export from.

2

It becomes one memory

Every asset, every customer, every job gets one record, with its history attached.

3

You ask, it answers

Ask out loud or by text, the way you would ask a person. It answers in seconds with the record behind it.

Numbers are used only where order is real. Bullet dots are tiny cyan glow dots, not discs or checkmarks.

Layout

Mobile first, one column that grows to two. Calm density: room inside every block, muted secondary text, and almost no boxes.

Measure. Content maxes at 1120 px with a side gutter of clamp(20px,4vw,48px). Running text stays under about 62 characters.

Rhythm. Sections are separated by generous padding and, at most, one hairline. Inside a section, kicker, then title, then lead, then the content.

Radii. 5 px chips and bubble tails, 16 px panels, 17 px bubbles, 42 px the phone, 999 px pills and inputs.

Not everything is a card. On the website the only bordered panel is the phone demo. Lists, steps, and fit columns sit directly on the ground and are separated by space.

Motion. Small and purposeful: a 1.4 s pulse on a live dot, a single border pulse when a suggestion lands, a 0.18 s pop on a new bubble. Every animation is off under reduced motion.

Verify at two widths. 1280 and 390. No horizontal scroll at either.

Voice

VoiceClaw sounds like a straight-talking operator who has done the digging and is telling you what they found. Plain, specific, on the owner's side, and honest about limits.

Plain English

Words an owner-operator uses at the shop. No industry, startup, or software jargon. If a specialist term is unavoidable, say what it means the first time.

"Get the data out, including the old software nobody can export from."

From the owner's side

Write from where they sit: the truck, the desk, the phone that will not stop. Name the pain the way they say it, in their own quoted excuses.

"I'd have to check." "Let me get back to you." "It's in a text somewhere."

Concrete over clever

Real questions, real nouns, real numbers with names and dates. A question they asked someone this week beats any benefit statement.

"What did we quote them last time?"

We did the digging

Never imply the data was easy to get. The answers were buried and we clawed them out. Claim the work, not the magic.

"Fourteen years of work orders clawed out of a legacy system that had no export."

Honest about limits

Say who it is not for. Say numbers belong on the call. Say the first customer is still an engagement in progress. Trust is the sale.

"We will tell you honestly whether your data can be clawed out, and what it would take."

Calm confidence

Short sentences. No exclamation marks. Fewer words on a wall read as confidence, not a gap. Let the answer do the talking.

"Now your business answers. Out loud, in seconds."
Tone by surface
SurfaceToneExample
Headline, bannerA question the owner asks themselves, or the twist line. One cyan word.Still chasing people for answers?
Product descriptionThe final one-liner, verbatim.A managed business memory you can talk to.
Product answerLabel, big value, one sentence with a name and a date. Names the source it checked.Unit 214 · brake job. On file. Signed work order and two photos from Mike's phone, added Tuesday 4:12 pm.
Call to actionLow pressure, specific ask, a promise of honesty.Twenty minutes. Bring the three questions you asked someone this week.
PricingStructure yes, numbers no.Fixed pilot fee, then a flat monthly fee. Numbers on the call, not on a pricing page.
Empty state, errorSay what it checked and what to do. No apology, no blame.Nothing on file for that unit yet. Ask Mike to add the work order from his phone.

Writing rules

The vocabulary is locked. These came out of real edits, and each one has a reason.

SayNotWhy
business memorysecond brainCustomers do not know the term. It sounds like a productivity app.
business memoryoperations memoryBroader than the shop. It covers customers, money, paperwork.
one record, with its history attachedqueryable, one queryable recordDatabase talk. Owners do not query, they ask.
a managed memoryeverything in one place"Managed memory" already implies one place. Do not say it twice.
asset, customer, jobtrailer, unit, work order (in generic copy)The nouns must fit every owner-operator, not only reefer trailers. Use the specific words only in customer-specific documents.
paperworkfile, document, record (when meaning the papers)It is the word they use when they are looking for it.
owner-operatorSMB, small business owner, userIt names the person who is the filing system.
a managed servicesoftware, platform, SaaS, appWe run it. They ask it. Nothing to install or administer.
a layer on top of what you runreplace, migrate, rip and replaceEverything stays. Replacing is their later decision, with the data in hand.
clawed out, we did the diggingyour business already knows, unlock, surfaceThe data was never easy to get. Claim the work.
memory, not receptionphone agent, receptionist, answering serviceIt answers the owner, not the phone. Keep the older VoiceClaw phone-agent framing out of this product.
ask, out loud or by textchat with your data, AI assistant, chatbotSay what they do, not what the technology is called. "AI" appears only when someone asks.
Punctuation and shape

No em dashes, ever. Periods, commas, and colons instead. Readers now read the long dash as a machine tell.

Short sentences. One idea each. Fragments are fine on a banner. "Then you ask."

Numbers as words in prose ("five to fifty", "fourteen years"). Digits only inside a product answer, where the number is the point.

Questions in threes. The problem is shown as three real questions: jobs, paperwork, money. Keep that order when you reuse the pattern.

Quote the excuses. The three excuses in quotation marks stack from bright to muted. It is the only place the site uses quotation marks as a design element.

No exclamation marks, no superlatives. "Simple", "powerful", "seamless", "revolutionary" do not appear anywhere.

Before and after
Not this

VoiceClaw is an AI-powered second brain that unlocks the data your business already has, giving SMBs a single queryable source of truth across all their systems!

Jargon, an exclamation mark, "second brain", "queryable", and it implies the data was sitting there ready.
This

A managed business memory you can talk to. We claw the answers out of your scattered data. Then you ask.

Plain, claims the work, and each sentence does one job.
Not this

Our platform seamlessly integrates with your existing tech stack, so there's no need for a costly migration.

"Platform", "seamlessly", "tech stack", "migration". None of these words come out of an owner's mouth.
This

Your job software, your accounting package, your document signing, your shared drive: they all stay. Nobody has to learn a new system on day one.

Names the real things they run and promises the thing they fear losing.

Demo content

Every demo, screenshot, and sample answer uses the same fictional cast. Never a real customer, never real numbers from a real customer's books.

QuestionLooked inAnswer
What jobs are still open from last week?work orders + shop board3 open. Unit 214 brake job (Mike), the Kowalski trailer inspection, and a road call in Barrie with no parts logged yet.
Where is the paperwork for that job?files + photosOn file. Signed work order and two photos from Mike's phone, added Tuesday 4:12 pm. Safety certificate due Oct 14.
What did we quote them last time?quotes + email$4,850. Henderson Farms, Mar 3. Reefer service, two units, parts included. Sent by email, never signed. Sandy can resend it.
Who owes us the most right now?accounting$18,200. Northgate Logistics, 74 days. Three invoices. Last payment came in June.

The cast: Mike (tech), Sandy (office), Henderson Farms, Northgate Logistics, the Kowalski trailer, Unit 214, a road call in Barrie. Reuse them so demos feel like one business. The proof line about the first customer stays anonymous: "a reefer trailer leasing and service company in Ontario."

Do and never

The short list to check any new surface against before it ships.

  • Start on navy. Paint the ground explicitly.
  • One cyan phrase per headline, with glow.
  • Inter, weight 500 for headings, 300 for big numbers.
  • Pills for buttons and inputs. One primary per view.
  • Glow to mark what is live and what is the answer.
  • Real questions as placeholders and examples.
  • The final one-liner, verbatim, as the description.
  • Say who it is not for.
  • Keep the LinkedIn cover's bottom-left corner empty.
  • Preview every iteration at a fresh filename.
  • No orange, no warm accent, no second accent.
  • No light theme. No grey or pure black grounds.
  • No purple-to-pink gradients, no glass blur panels.
  • No emoji as icons. No icon-in-a-circle feature cards.
  • No centred hero with three feature cards under it.
  • No bold weight. No exclamation marks.
  • No em dashes anywhere in outbound text.
  • No "second brain", "queryable", "platform", "AI-powered".
  • No real customer names or numbers in demos.
  • No prices on a page. Numbers on the call.

Files

Where the truth lives and how to start a new surface in ten lines.

Tokens. ~/VoiceClaw/website/brand/voiceclaw-tokens.css. Every variable and class used on this page comes from it. Link it, add class="vc" to the root element, and build on the variables.

Logo. brand/voiceclaw-logo.svg, single flat fill, recolour by changing the fill.

Reference surfaces. voiceclaw.ca (the site), the trade-show sketches in VoiceClaw/marketing/trade-show, the LinkedIn cover in VoiceClaw/marketing/linkedin-cover.

Booking link. Every call to action goes to cal.com/ian-pilon/20min.

<link rel="stylesheet" href="voiceclaw-tokens.css">
<body class="vc">
  <span class="kicker">For owner-operators</span>
  <h1>A managed business memory you can
      <em class="hl">talk to.</em></h1>
  <p class="lead">Ask about any asset, customer, or job
      and get an answer by voice or text instead of
      chasing people.</p>
  <a class="btn primary" href="https://cal.com/ian-pilon/20min">
      Book a 20-minute call</a>
</body>