Brand kit | OneForm

Logo

An open ensō around one dot.

A single brush-stroke ring in the brand gradient, open at the top right, around one dot: one form. The wordmark sets “One” in Inter Medium and “Form” in Inter Light.

Preview on

Logo

The mark and the wordmark together. Use this wherever there's room.

For light backgrounds
Logo
Light pages, documents
SVG PNG 64h PNG 128h PNG 256h PDF
Logo on dark
Dark pages, most social posts
SVG PNG 64h PNG 128h PNG 256h PDF
Logo, white
One colour on dark or photos
SVG PNG 64h PNG 128h PNG 256h
For light backgrounds
Logo, black
One colour: stamps, embossing
SVG PNG 64h PNG 128h PNG 256h

Mark

The ensō alone, for avatars, corners and watermarks.

For light backgrounds
Mark
Avatars and small spaces on light
SVG PNG 256 PNG 512 PNG 1024
Mark on dark
Corners and watermarks on dark
SVG PNG 256 PNG 512 PNG 1024
Mark, white
One colour on dark
SVG PNG 256 PNG 512 PNG 1024
For light backgrounds
Mark, black
One colour on light
SVG PNG 256 PNG 512 PNG 1024

App icon

The mark on a rounded tile, for home screens and profile pictures.

App icon
Home screens, profile pictures
SVG PNG 120 PNG 180 PNG 192 PNG 512 PNG 1024
App icon, dark
Profile pictures on social
SVG PNG 180 PNG 192 PNG 512 PNG 1024

Also in the kit

Clear space

Room to breathe.

Give the logo space and keep it legible. These are the minimums; more is usually better.

x = ¼ of the mark's height. Keep at least x clear on every side of the logo: no text, edges or other marks inside the dashed line.

The mark alone keeps the same x. The mark is 4x tall, so the space around it is a quarter of its height.

20 px

Full logo

At least 20 px tall

16 px

Mark

At least 16 px

Shown at actual size on screen. Below 16 px, use the favicon files, which are made for tiny sizes.

Misuse

Please don't.

Use the files as they are. If none of them fits, use the white or black version rather than changing one.

Don't stretch or squash it
Don't recolour the gradient
Don't rotate it
Don't add shadows or effects
Don't outline it
OneForm
Don't retype the wordmark
Don't place it on a busy background
Don't use a version without enough contrast

Colour

A near-black stage, one gradient.

Warm neutrals do most of the work. The gradient is the accent, used once per design.

Brand

The three gradient stops. One gradient moment per design: a key word, the main button or the mark.

Pink--color-pink
Gradient start
HEX
RGB
HSL
OKLCH
On stage7.02:1AAA
On white2.83:1Fail
Violet--color-violet
Gradient middle
HEX
RGB
HSL
OKLCH
On stage6.12:1AA
On white3.24:1AA large
Blue--color-blue
Gradient end
HEX
RGB
HSL
OKLCH
On stage6.00:1AA
On white3.31:1AA large

Dark (website, social)

The default for marketing. Text is a warm off-white, never pure white.

Stage--color-bg
Page background
HEX
RGB
HSL
OKLCH
On stage1.00:1Fail
On white19.90:1AAA
Panel--color-paper
Cards
HEX
RGB
HSL
OKLCH
On stage1.05:1Fail
On white18.89:1AAA
Raised--color-wash
Chips, raised surfaces
HEX
RGB
HSL
OKLCH
On stage1.10:1Fail
On white17.93:1AAA
Raised 2--color-sumi
Raised surfaces
HEX
RGB
HSL
OKLCH
On stage1.20:1Fail
On white16.50:1AAA
Hairline--color-line
1 px borders
HEX
RGB
HSL
OKLCH
On stage1.20:1Fail
On white16.49:1AAA
Hairline 2--color-line-2
Stronger borders
HEX
RGB
HSL
OKLCH
On stage1.44:1Fail
On white13.75:1AAA
Night indigo--color-night
Sky near the horizon
HEX
RGB
HSL
OKLCH
On stage1.22:1Fail
On white16.20:1AAA
Text--color-ink
Headlines, main text
HEX
RGB
HSL
OKLCH
On stage17.45:1AAA
On white1.14:1Fail
Text 2--color-ink-2
Subheads, body
HEX
RGB
HSL
OKLCH
On stage12.37:1AAA
On white1.60:1Fail
Muted--color-muted
Supporting text
HEX
RGB
HSL
OKLCH
On stage6.46:1AA
On white3.07:1AA large
Faint--color-faint
Fine print
HEX
RGB
HSL
OKLCH
On stage5.31:1AA
On white3.74:1AA large

Light (app, reports)

The app and the PDF reports, for product screenshots and light variants.

Paper--color-light-paper
Page
HEX
RGB
HSL
OKLCH
On stage19.90:1AAA
On white1.00:1Fail
Wash--color-light-wash
Backgrounds
HEX
RGB
HSL
OKLCH
On stage19.04:1AAA
On white1.04:1Fail
Ink--color-light-ink
Text, the logo's dot
HEX
RGB
HSL
OKLCH
On stage1.00:1Fail
On white19.79:1AAA
Ink 2--color-light-ink-2
Secondary text
HEX
RGB
HSL
OKLCH
On stage1.77:1Fail
On white11.20:1AAA
Muted--color-light-muted
Supporting text
HEX
RGB
HSL
OKLCH
On stage2.97:1Fail
On white6.68:1AA
Line--color-light-line
Borders
HEX
RGB
HSL
OKLCH
On stage16.97:1AAA
On white1.17:1Fail
Line 2--color-light-line-2
Stronger borders
HEX
RGB
HSL
OKLCH
On stage15.33:1AAA
On white1.29:1Fail
App violet--color-light-accent
The app's accent
HEX
RGB
HSL
OKLCH
On stage6.04:1AA
On white3.29:1AA large

Contrast is the WCAG 2 ratio for text in that colour. AA needs 4.5:1 (3:1 for large text), AAA needs 7:1. Click a colour or a value to copy it.

The gradient

Pink at the top left to blue at the bottom right. Use it once per design: the key word of a headline, the main button, the mark or a thin line. Never on large backgrounds, icons or body text.

background: linear-gradient(100deg, #ff5fa2 0%, #b36bff 48%, #3d8bff 100%);

#FF5FA20%

#B36BFF48%

#3D8BFF100%

Design tokens

Every colour above, the gradient and the font stacks, ready to paste into a project.

/* OneForm design tokens */
:root {
  /* Brand */
  --color-pink: #ff5fa2;
  --color-violet: #b36bff;
  --color-blue: #3d8bff;
  /* Dark (website, social) */
  --color-bg: #09090a;
  --color-paper: #111110;
  --color-wash: #171716;
  --color-sumi: #1f1f1d;
  --color-line: #1f1f1e;
  --color-line-2: #2e2d2b;
  --color-night: #1a1c45;
  --color-ink: #f1f0ec;
  --color-ink-2: #cdccc7;
  --color-muted: #94938e;
  --color-faint: #85847f;
  /* Light (app, reports) */
  --color-light-paper: #ffffff;
  --color-light-wash: #fafaf8;
  --color-light-ink: #0a0a0a;
  --color-light-ink-2: #3b3b3b;
  --color-light-muted: #5c5c5c;
  --color-light-line: #ededeb;
  --color-light-line-2: #e2e2df;
  --color-light-accent: #8b7bff;
  /* Gradient and type */
  --grad: linear-gradient(100deg, #ff5fa2 0%, #b36bff 48%, #3d8bff 100%);
  --font-sans: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-logo: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}

Typography

Three free typefaces.

All three are on Google Fonts. Headlines are big and tight, in sentence case.

Aa

Inter Tight

Headlines (SemiBold 600, −2%, line height 1.04) and body text (Regular 400, line height 1.6) on the website.

Google Fonts ↗

OneForm

Inter

The wordmark: “One” in Medium 500, “Form” in Light 300, tracking −2%. Use the logo file rather than retyping it.

Google Fonts ↗

Forms to automated reports

JetBrains Mono

Small labels and chips: all caps, tracking +14%, about 11 px on the web.

Google Fonts ↗

The type scale

Edit the sample to see your own words at every size the site uses.

Sample

Display
Inter Tight 600 · 40 → 60 px · −2% · 1.04
Forms in. Reports out.
Heading
Inter Tight 600 · 34 → 48 px · −2% · 1.04
Forms in. Reports out.
Subheading
Inter Tight 600 · 26 → 32 px · −2%
Forms in. Reports out.
Title
Inter Tight 500 · 16 px
Forms in. Reports out.
Body
Inter Tight 400 · 15.5 → 17 px · 1.6
Forms in. Reports out.
Small
Inter Tight 400 · 13.5 px
Forms in. Reports out.
Label
JetBrains Mono 400 · 11 px · caps · +14%
Forms in. Reports out.

Iconography

Thin lines, quiet tiles.

White line icons with a 1.6 px stroke on neutral dark tiles. They draw themselves in once, then move a little. Never in the gradient.

Click an icon to copy its SVG.

Voice & tone

Calm, precise, plain.

We write like a sharp senior accountant: short sentences, concrete words, and the firm always in control.

Calm, confident, precise
Write like a sharp senior accountant, not a startup chasing attention.
Short sentences, plain words
“Forms in. Reports out.” is the model: two beats, nothing extra.
Concrete over abstract
Name the thing the reader gets: a memo, a booking, a paid report.
The firm stays in control
The AI drafts and the firm approves. Never suggest it replaces the accountant or advisor.
Only what's true
No invented numbers, quotes, client logos or ratings. Voice forms are always labelled beta.

Headlines

Write

Not

Write: Every response becomes a report.
Not: Unlock AI-powered productivity for your practice!
Write: A planning memo for every client, drafted before you open your inbox.
Not: The revolutionary AI that 10x’s your firm.
Write: Review it. Approve it. Send it.
Not: Let the AI handle your clients for you.
Write: Know which lead to call first.
Not: Unleash next-gen lead intelligence 🚀
Write: A booking page that gets you paid before the call.
Not: A game-changing scheduling experience.

Words we leave out:revolutionarygame-changer10xunleashnext-genrocket emojiexclamation marks

Boilerplate

Ready to paste.

For articles, directories, event listings and partner pages. Please keep them factual; shorten them rather than adding claims.

Tagline
Forms in. Reports out.
Category line
Forms to automated reports
One-liner· 33 words
OneForm is an AI form builder for accounting firms, financial advisors and professional practices. It turns every form response into a reviewed, client-ready report, with paid reports, booking and lead scoring built in.
About 50 words· 51 words
OneForm is an AI form builder for accounting firms, financial advisors and professional practices. Describe a form in one sentence and OneFormAI builds it. Each response becomes a draft report, and the firm reviews, approves and sends it as a branded PDF. Paid reports, bookings and lead scoring are built in.
About 100 words· 99 words
OneForm is an AI form builder for tax and accounting firms, financial advisors and professional-services firms. It turns every form response into a reviewed, client-ready report. A firm describes the form it needs in one sentence, or starts from a template such as a year-end planning questionnaire, and OneFormAI builds it. Clients answer a branded form on any device, or talk to it with voice forms (beta). Each response becomes an AI-drafted report that the firm reviews, edits and approves before it goes out as a branded PDF. Paid reports, booking pages, lead scoring and workflows are built in.

Writing the name

One word, capital O and capital F.

Correct: OneForm
Correct: OneFormAI (the form builder's AI)
Incorrect: Oneform
Incorrect: One Form
Incorrect: ONEFORM

Screenshots

The product, as it is.

Real screens from the app at full resolution (WebP). Please don't edit what they show.

Create with AI
WebP · 2880 × 1800
Download
Form builder
WebP · 2880 × 1800
Download
A client's form
WebP · 2880 × 1800
Download
Report review
WebP · 2880 × 1800
Download
Responses
WebP · 2880 × 1800
Download
Leads
WebP · 2880 × 1800
Download
Workflows
WebP · 2880 × 1800
Download
Insights
WebP · 2880 × 1800
Download
Integrations
WebP · 2880 × 1800
Download
Voice forms (beta)
WebP · 2880 × 1800
Download
Voice forms on a phone (beta)
WebP · 1170 × 2532
Download

Badge

Made with OneForm.

The small badge OneForm shows on the forms and pages a firm's clients see. Here as files, in its light and dark versions.

On light pagesSVG
<a href="https://oneform.si/"><img src="https://oneform.si/brand/badge/made-with-oneform-light.svg" alt="Made with OneForm" width="138" height="22"></a>
On dark pagesSVG
<a href="https://oneform.si/"><img src="https://oneform.si/brand/badge/made-with-oneform-dark.svg" alt="Made with OneForm" width="138" height="22"></a>

Press

Questions about the brand?

Writing about OneForm, or need a file that isn't here? Ask us.

Press and brand questions

The OneForm brand, in one place.

An open ensō around one dot.

Logo

Mark

App icon

Also in the kit

Room to breathe.

Please don't.

A near-black stage, one gradient.

Brand

Dark (website, social)

Light (app, reports)

The gradient

Design tokens

Three free typefaces.

The type scale

Thin lines, quiet tiles.

Calm, precise, plain.

Headlines

Ready to paste.

Writing the name

The product, as it is.

Made with OneForm.

Questions about the brand?

From form to finished report, automatically.