How Korr looks, moves and sounds.
This document is built from the same tokens, fonts and components as the site. If the code changes, this changes. It's the reference for designing, writing or printing anything that carries the brand.
A compact engineering studio building software that survives Monday.
Tagline · ES
Construido para correr fino.
Tagline · EN
Built to run true.
// metaphors
The watchmaker
We tune every part until the movement runs without friction. Precision, finish, parts that fit. Use it to talk about craft and care.
Compile vision → product
The client's idea goes in as source and comes out as something running in production. Use it to talk about process and embedded AI.
// attributes
Precise.
We say exactly what we do. Numbers, timelines, scope.
Editorial.
Plenty of air, clear hierarchy, zero decorative noise.
Technical.
Terminal aesthetics: mono, prompts, states, versions.
Close.
Two people answer. Plain words, short sentences, no corporate jargon.
The KORR. wordmark and a dot that signs everything.
// clear space
Keep at least half the height of the K (x) free on every side. Nothing enters that zone: text, edges or other logos.
// anatomy
- Typeface
- Fraunces SemiBold · opsz 144 · wght 600
- Tracking
- −0.04em
- Dot
- Fraunces «.» glyph · +0.03em of air · always phosphor
- Master
- Outlined SVG · public/brand/korr-wordmark.svg
Never retype the logo: use the SVG. Typed in another app, tracking, optical size and kerning drift.
// minimum size
- Wordmark, screen
- 80 px wide
- Wordmark, print
- 20 mm wide
- K. monogram
- 16 px · 5 mm
- Dot (symbol)
- 12 px · 3 mm
// versions
Primary
Ink on bone. The default.
Inverse
Bone on ink. Dark backgrounds, ink sections, social.
Monochrome
One ink: engraving, stamps, embossing. Only when phosphor can't be reproduced.
// monogram & symbol
K. monogram
Avatars, large favicons, seals. Square spaces where KORR. can't breathe.
Dot
The symbol. Favicon, cursor, «operational» states. On its own, it's already Korr.
// retired
The stroke K inside a rounded square (korr-svg-icon-pack/korr-monogram.svg and korr-dot-mark.svg) is not part of the system: it belongs to another visual family. Use the Fraunces K. monogram.
// writing the name
- KORR.
- Logo only. Never inside a sentence.
- Korr
- In running text: «Korr exists for that».
- KORR Labs
- Trade name: signatures, metadata, directories, Google. Always KORR in caps, as in the legal name.
- KORR Labs SpA
- Legal entity, RUT 78.483.181-7: contracts, invoices, legal.
Never: «korr», «Korr Labs», «KORR» alone in running text, «Korr.» with a period mid-sentence.
// don't
Paper, ink and a single green light.
The palette is almost monochrome on purpose. Phosphor is scarce: when it shows up, it means something (active state, focus, primary action, the signature).
Bone
Default background. Warm paper.
- Hex
- RGB
- 244 243 238
- CMYK
- 0 0 2 4
- Token
- bone
Natural or off-white stock
Ink
Primary text and dark sections.
- Hex
- RGB
- 10 10 10
- CMYK
- 60 40 40 100
- Token
- ink
Rich black
Ink soft
Long-form body text.
- Hex
- RGB
- 26 26 26
- CMYK
- 0 0 0 90
- Token
- ink-soft
Muted
Labels, metadata, second beat of headlines.
- Hex
- RGB
- 107 107 102
- CMYK
- 0 0 5 58
- Token
- muted
Phosphor
Brand accent. The dot.
- Hex
- RGB
- 0 230 118
- CMYK
- 65 0 70 0
- Token
- phosphor
Pantone 7479 C (approx.)
Phosphor doesn't exist in CMYK: automatic conversion dulls it. Use the recipe above or a spot ink, and always validate with a printed proof.
// proportion
// contrast (WCAG 2.2)
| Pair | Ratio | Normal text | Large text |
|---|---|---|---|
| Aaink / bone | 17.82 | AA ✓ | AA ✓ |
| Aaink-soft / bone | 15.67 | AA ✓ | AA ✓ |
| Aamuted / bone | 4.82 | AA ✓ | AA ✓ |
| Aaphosphor / bone | 1.50 | ✕ | ✕ |
| Aabone / ink | 17.82 | AA ✓ | AA ✓ |
| Aaphosphor / ink | 11.86 | AA ✓ | AA ✓ |
| Aamuted / ink | 3.70 | ✕ | AA ✓ |
Phosphor on bone is 1.50:1: never as text or as the only state indicator on light backgrounds. On ink it works (11.86:1). Muted on ink fails AA for small text: on ink use bone at 60 % or more.
// phosphor rules
- 01One green accent per view, and the logo dot counts. If there are two, one is too many.
- 02On the web, persistent chrome (nav logo, cursor, booking bar) doesn't count: the rule applies to each section's composition.
- 03Glow belongs to screens and motion (cursor, hero, active states). Never in print or on the static logo.
- 04Never as a background for large areas. It's a light, not a surface.
- 05No gradients. No color in the palette is ever graded.
A serif with character, a technical family for everything else.
Aa
Fraunces
Display. Headlines, wordmark, featured numbers.
Built to run true.
SemiBold 600 for the mark · Regular/Medium for headlines · Italic for the second beat
Aa
IBM Plex Sans
Text. Paragraphs, forms, interface.
We build software, apps and automation shaped around what your business actually needs.
Regular 400 · Medium 500 · line height 1.6
Aa
IBM Plex Mono
Technical. Labels, prompts, metadata, code.
01 · Operational · Open for projects
Medium 500 · UPPERCASE · tracking 0.12–0.16em · 11–12 px
// scale
Display XL
Fraunces 600 · 10–14vw · lh 0.92 · −0.06em
2025
H1 / H2
Fraunces 400 · 36 → 60 px · lh 1.05 · −0.04em
Let's build something
H3
Fraunces 500 · 20 → 24 px · −0.04em
ERP & internal systems
Body
Plex Sans 400 · 16–18 px · lh 1.6
Short cycles and fast decisions.
Label
Plex Mono 500 · 11 px · CAPS · 0.14em
// method
// type signature: two-beat headline
Headlines are written in two beats: the statement in roman, the payoff in italic, in muted. It's the brand's most recognizable editorial gesture.
We build software the way a watchmaker tunes a movement — part by part.
Thin stroke, simple geometry, green only when it means something.
- Grid
- 24 × 24
- Stroke
- 1.75 px · round caps and joins
- Color
- currentColor · phosphor accent for states only
- Fill
- None. Outline only.
Source: src/components/ui/icons.tsx · SVGs in public/korr-svg-icon-pack/icons
Twelve columns, hairlines and the bone / ink rhythm.
- Container
- max 1200 px · 24 px margin mobile / 40 px desktop
- Columns
- 12 on desktop · 1 on mobile · a single breakpoint (768 px)
- Lines
- 1 px hairlines in ink at 12 %. Never thick borders or shadows.
- Rhythm
- Sections alternate bone and ink backgrounds.
- Radii
- Square by default. Pill (999 px) only for buttons and chips.
- Textures
- 3.5 % noise and a 64 px blueprint grid. Always subtle.
// section header
Every section opens the same way: numbered prompt + name on the left (phosphor on ink, ink on bone), slash-style route on the right, in mono.
Motion confirms, it doesn't decorate.
- Curve
- cubic-bezier(0.22, 1, 0.36, 1): leaves fast, settles soft
- Micro
- 320 ms · hover, focus, dot reveal
- Entrance
- 900 ms · fade + 24 px up, once
- Scramble
- Technical characters resolving into text. For the mark and CTAs, not paragraphs.
- Idle
- 8 s breathing. Nothing blinks faster than a cursor.
- Accessibility
- prefers-reduced-motion turns off everything but opacity.
We talk like engineers who can write.
Concrete.
Numbers, timelines and deliverables before adjectives.
Direct.
Short sentences. One idea per sentence.
Neutral Spanish.
Chilean, but neutral tú — no voseo, no slang. «Escríbenos», not «escribínos».
No fluff.
No exclamation marks, no emojis, no superlatives.
We get back to you within one business day with scope, shape and cost.
We'll be in touch ASAP!
ERP, web and mobile, production-ready.
Cutting-edge end-to-end solutions to empower your business.
Two people sign off every decision.
A team of experts passionate about innovation.
Tell us what you're building.
Reach out to our team of rockstars!
// words we don't use
// writing rules
- 01«IA» in Spanish, «AI» in English. Never mixed.
- 02Numbers as digits: 3 projects, 1 business day, 2025.
- 03Labels and metadata in mono caps; running text, never.
- 04Em dash (—) for the payoff of a sentence, sparingly: one per paragraph.
The brand off the site.
Social preview (OG)
Route-generated, 1200 × 630. Copy comes from the dictionaries.
src/app/[lang]/opengraph-image.tsx
Social avatar
K. monogram on ink. Instagram, LinkedIn, GitHub.
public/brand/korr-avatar-ink.svg
Video call background
Bone with a quiet wordmark. 1920 × 1080.
public/brand/korr-zoom-bg-bone.png
Business cards
Press-ready PDF with a vCard QR.
python3 scripts/generate-cards.py
Social templates
Headline, stat, case and announcement. Post 4:5, square and story formats, copy via parameters.
/en/social/{titular,cifra,caso,anuncio}?size=post|square|story
Proposals & deck
A4 sales proposal from a JSON file and a 16:9 credentials deck from the site dictionaries.
node scripts/generate-proposal.mjs · node scripts/generate-deck.mjs
// email signature
Plain text with minimal structure. No image logo: most mail clients block it.
—
First Last
Co-founder & CTO · KORR Labs
korr.cl · Santiago / Remote
The master files.
Wordmark · SVG
Monogram & symbol · SVG
