The living visual identity system for Unpaste. Every touchpoint — website, social, email, ad — follows these rules.
No exceptions.
System
Asset Templates
Unpaste's visual identity is Swiss Brutalist — precision, engineering, and no-nonsense functionality. Every element says "we build systems, not brochures."
A senior engineer who spent 10 years watching businesses drown in spreadsheets and manual processes, finally snapped, and built the tools to fix it.
Red is for interactive elements and structural dividers. Never for large backgrounds. High contrast always.
Primary Palette
Support Palette
Colour Rules
Selection highlight — red background, white text. Try selecting this text.
Dark sections use dark palette on light pages for contrast rhythm.
Never use red for large background areas.
Never use low-contrast gray-on-gray text.
Display / Headlines
STOP COPY-PASTING.
Body Text
You're losing hours every week to work a machine should be doing. We find it, we fix it, and you get your time back. Short. Declarative. Paragraphs are 1–3 sentences.
Monospace / Labels
[001] EFFICIENCY SCORE — BRISBANE SMB — 2026
Type Scale
Headline Patterns
FROM OVERWHELMED
TO OPTIMISED.
Red accent on the key word
36 HOURS → 1 HOUR.
Data-first proof format
Spacing Scale
Border Radius
0px everywhere. Zero. Non-negotiable. Sharp corners are the brutalist identity.
Layout Constraints
Grid Overlay — 60px Desktop / 40px Mobile
Buttons
Primary CTA
Outline / Secondary
Hover to see shadow grow. Click to see shadow compress. Monospace, uppercase, 12px, bold, tracked. Never rounded.
Shadow Hierarchy
Container shadow is always larger than nested children. Maintains visual hierarchy.
Dividers
Primary — 2px solid red
Secondary — 1px dashed muted
Never use solid gray lines. Either red (bold) or dashed (subtle).
Cards
White background, 1px border. Scroll to see it rise off the page. No border radius.
2px dashed red border. Corner bracket accents. 20px grid background at 3% opacity.
Static shadow. For elements that need permanent elevation without hover state.
Data Labels — Key-Value Pattern
Single-letter monospace labels paired with values. Use across business cards, documents, proposals, email signatures — anywhere structured data is displayed.
Reinforces the engineering personality without being cold.
Section Tags
Space Mono, 11px, bold, uppercase, red, tracked. General-purpose label pattern — not just for page sections. Use on business cards, documents, proposals.
Status Indicators
Logo in copy: uppercase wordmark (UNPASTE). In body text: title case (Unpaste). Never "Unpaste team" or "our experts."
Variations
Headlines
"Stop Copy-Pasting."
"36 Hours → 1 Hour. Here's How."
"Your Website Should Work While You Sleep."
"Leveraging Cutting-Edge AI Solutions"
"Your Digital Transformation Journey Starts Here"
"Committed to Excellence in AI-Powered Innovation"
Describing What We Do
"AI that generates your quotes" — specific
"Connects your existing tools" — mechanical
"Works 24/7" — concrete outcome
"AI-powered solution" — vague prefix
"Seamless integration" — nothing is seamless
"Revolutionising workflows" — we automate admin
Sentence Rhythm
Short. Declarative. We favour fragments over run-ons.
Paragraphs are 1–3 sentences. When we use a longer sentence, it's for technical explanation, not decoration.
The rhythm is: short punch, short punch, slightly longer explanation. Then back to punching.
Banned Words & Phrases
Words We Use
Every animation has a purpose. Click the replay buttons to see each in action. Animations feel mechanical and precise — matching the engineering brand.
01 — Text Reveal (Slide Up)
02 — Staggered Content Reveal
03 — Marquee Ticker
04 — Counter Animation
05 — Button Hover States
Shadow grows, shifts -2px
Fill inverts, shadow grows
06 — Card Hover State
Hover for shadow
Dashed border
07 — Typewriter Effect
08 — Colour Copy Feedback
Motion Rules
Smooth, intentional easing (never linear)
Mechanical precision — engineering brand
200–500ms micro, 500–1000ms transitions
Respect prefers-reduced-motion always
Max 2 animation techniques per page
Bounce or overshoot effects
Animations exceeding 1 second
Animation without purpose ("looks cool")
Parallax + fade + zoom + float = overload
Autoplay video with sound
Dark sections use the inverted palette on light-mode pages for contrast rhythm. Testimonials, calculators, and feature highlights.
Run every design through this before it ships. If any item is true, stop and fix it.
Visual Red Flags
Structural Red Flags
Brand Red Flags
90 x 55mm. The card IS the brand — brutalist shadow, section tags, data labels. No rounded corners, no gradients.
Front
Elliot Stone
[001] FOUNDER
| W | unpaste.ai |
| E | elliot@unpaste.co |
| L | Brisbane, Australia |
Back
UNPASTE
STOP COPY-PASTING.
Gmail-compatible. Brutalist card with box-shadow. All components map directly to the design system — section tags, data labels, red divider.
Live Preview
|
Design System Mapping
Gmail-compatible (table-based layout). Courier New replaces Space Mono for email client support.
A4 format. The header/footer pattern carries across all formal documents — proposals, contracts, reports.
12 FEBRUARY 2026
[001] SUBJECT
DOCUMENT TITLE HERE
Structure Rules
Header: Logo + date, red divider underneath. Always present.
Section tags: Use [001], [002] for document sections, same as website.
Body: Inter 11pt, 1.5 leading. Left-aligned. Max width 160mm.
Footer: Dashed separator, data labels (W/E), page numbers in monospace.
Margins: 25mm top/bottom, 20mm sides.
Applies To
Client-facing financial documents. Same system — but data-heavy layouts use the monospace data label pattern extensively.
INVOICE
#INV-2026-001
[001] BILLED TO
Client Name Pty Ltd
123 Business St
Brisbane QLD 4000
Design Rules
Header: Same as letterhead — logo, red divider, document type.
Numbers: Monospace (Space Mono / Courier New). Right-aligned. Totals get weight 800 at larger size.
Line items: Separated by dashed borders, not solid lines.
Section tags: [001] BILLED TO, [002] LINE ITEMS, [003] PAYMENT DETAILS.
No colour in data: Numbers stay foreground or muted-text. Red is only for structural elements and tags.
Applies To
Every element — colours, type, spacing, components, voice — composing together. This is what Unpaste looks like when the full system is applied.
[A]
Grid texture
[B]
Section tag
[C]
Red accent word
[D]
Shadow buttons
[E]
Mono nav labels
SOCIAL MEDIA
Every platform, same system. The grid background, section tags, and sharp corners make Unpaste posts instantly recognisable at feed size.
Instagram Post — 1080 x 1080
YOUR WEBSITE
IS A BROCHURE.
It should be working 24/7 — qualifying leads, answering questions, booking meetings.
Story — 1080 x 1920
36
HOURS / WEEK
Average time Brisbane SMBs
lose to manual processes
Facebook Cover — 820 x 312
STOP
COPY-PASTING.
AI AUTOMATION — BRISBANE
LinkedIn Banner — 1584 x 396
SMART WEBSITES & AI AUTOMATION
BRISBANECommon Elements Across All Formats
Grid background texture (40px, 3-5% opacity)
Section tag label [001]
Logo mark (red square) at minimum 14px
Text minimum 48px on 1080px canvas
Rounded corners on frames or images
Gradient backgrounds or gradient text
Stock photography overlays
More than 2 font sizes per graphic