UIX
Sign in Start free

Presets Colophon Hashmark

Colophon Hashmark

Editorial Web3 interface: ink-toned warm neutrals, wide Unbounded headlines and one ember action color for on-chain tools.

Pro Use this preset Use in Figma Get the files

A live preview of a Pro preset. Its files, Figma sync and MCP come with UIX Pro.Unlock

Color

Five ramps, 50 to 950

brand50fff5ee100ffe6d4200ffcaa6300f9a772400e97f3f500cf6220600b04f127008f3f0e8006e300c9004f21099502f1204
neutral50fbf7f3100f3ece6200e4dbd3300cdc2b9400ab9f945008a7e736006e6258700574c438003f37319002a241f9501b1612
success50eff8ef100d8f0da200b0e0b73007fc98c4004caf665002f914c60023773d7001b6133800154b289000f371d950082210
warning50fdf8e8100faedc4200f3dc8f300e9c656400d9ab2c500bb8c126009a70097007a56088005e420a900432f089502a1d04
danger50fff3f5100ffe3e8200ffc4cf300ff98ab400f36b87500d9466a600b92d52700951e4080074182f90055101f950370812

Semantic tokens

Light and dark

Light
background#fbf7f3
foreground#1b1612
card#ffffff
card-foreground#1b1612
popover#ffffff
popover-foreground#1b1612
primary#b04f12
primary-foreground#ffffff
secondary#f3ece6
secondary-foreground#2a241f
muted#f3ece6
muted-foreground#574c43
accent#ffe6d4
accent-foreground#4f2109
destructive#b92d52
destructive-foreground#ffffff
success#1b6133
success-foreground#ffffff
warning#f3dc8f
warning-foreground#432f08
border#e4dbd3
input#cdc2b9
ring#cf6220
Dark
background#1b1612
foreground#fbf7f3
card#2a241f
card-foreground#fbf7f3
popover#2a241f
popover-foreground#fbf7f3
primary#e97f3f
primary-foreground#2f1204
secondary#3f3731
secondary-foreground#f3ece6
muted#3f3731
muted-foreground#cdc2b9
accent#4f2109
accent-foreground#ffe6d4
destructive#f36b87
destructive-foreground#370812
success#4caf66
success-foreground#082210
warning#d9ab2c
warning-foreground#2a1d04
border#3f3731
input#574c43
ring#e97f3f

Typography

Unbounded, Onest and JetBrains Mono

Grow what matters

display-lg · 61/1.05 · 600 · -0.035em
Unbounded

Grow what matters

display-md · 39/1.1 · 600 · -0.03em
Unbounded

A calmer way to work

heading-lg · 31/1.2 · 500 · -0.02em
Unbounded

A calmer way to work

heading-md · 25/1.3 · 600 · -0.015em
Onest

A calmer way to work

heading-sm · 20/1.35 · 600 · -0.01em
Onest

Good systems disappear. People notice the product, not the parts.

body-lg · 18/1.65 · 400
Onest

Good systems disappear. People notice the product, not the parts.

body-md · 16/1.6 · 400
Onest

Good systems disappear. People notice the product, not the parts.

body-sm · 14/1.55 · 400
Onest

Save changes

label · 14/1.3 · 500 · 0.005em
Onest

Updated 2 minutes ago

caption · 12/1.4 · 500 · 0.02em
Onest

const theme = preset("colophon-hashmark")

code · 14/1.5 · 400
JetBrains Mono

Spacing · radius · shadow

The quiet rules

0.52px
14px
1.56px
28px
312px
416px
520px
624px
832px
1040px
1248px
1664px
2080px
2496px
sm
4px
md
6px
lg
10px
xl
16px
full
full
sm
md
lg

Components

Every part, every state

Buttons

DefaultHoverFocusDisabledPrimarySecondaryOutlineGhostDestructive

Inputs

Placeholder
Focused
Use at least 8 characters
Team
Design
Opens a menu
Disabled

Navigation

ProductPricingCustomersDocs

12 projects, 3 due this week.

Home / Projects / Q3 launch

Feedback

New version availableReload to get the latest features.
Payment received2,400 from Md Rakib Shekh.
Card expires soonUpdate it before Friday.
Sync failedWe will try again in 30 seconds.
NJ
Nusrat JahanCommented on Q3 launch
Invoice sent to Israt Jahan
Undo
PrimarySecondaryOutlineActivePendingFailedNew
Copied to clipboard72%
MRNJIJMRNJIJ+5

Cards, table and overlays

Monthly revenue12.4%

48,210

74% of the 65k goal
The web3 report

What changed this quarter, and what to do next.

MRMd Rakib Shekh4 min read
IJ
Israt Jahan

Product designer

CustomerDateStatusAmount
MRMd Rakib ShekhMar 12Paid2,400.00
NJNusrat JahanMar 11Pending860.00
IJIsrat JahanMar 09Failed1,120.00
Showing 1–3 of 36
Q3 launch24 files, edited today
Delete project?

“Q3 launch” and its 24 files will be removed for everyone. You can’t undo this.

No messages yet

When customers write to you, their messages show up here.

Screens

Colophon Hashmark as a real product

Landing page

colophon-hashmark.com
ProductPricingCustomersDocs
New · web3

Colophon Hashmark

Editorial Web3 interface: ink-toned warm neutrals, wide Unbounded headlines and one ember action color for on-chain tools.

MRNJIJLoved by 2,000+ teams
This week

+24.6%

Dashboard

Good morning, Rakib

Overview

Revenue

48,210

+12.4%
Customers

2,318

+4.1%
Churn

1.8%

-0.3%
Revenue
CustomerDateStatusAmount
MRMd Rakib ShekhMar 12Paid2,400.00
NJNusrat JahanMar 11Pending860.00
IJIsrat JahanMar 09Failed1,120.00

Phone app

9:41●●● 100%

Welcome back

Md Rakib Shekh
MR
Balance

12,480

MR
Md Rakib ShekhPaid
2,400
NJ
Nusrat JahanPending
860
IJ
Israt JahanFailed
1,120
9:41●●● 100%

Q3 launch

1 of 3 doneOn track for Friday.

Pricing

Starter

0 a month

For trying things out

  • 1 project
  • Basic reports
  • Email support
ProPopular

24 a month

For growing teams

  • Unlimited projects
  • Team workspaces
  • Priority support
  • Advanced reports
Business

79 a month

For larger organisations

  • Everything in Pro
  • SSO and audit log
  • A dedicated manager
Can I change plans later?

Yes. Move up or down any time, and we work out the difference for you.

Is there a free trial?

Starter is free for as long as you like. Pro is free for the first 14 days.

Do teams get a discount?

Teams of 20 or more get 20% off. Write to us and we will set it up.

Sign in

Welcome back

Sign in to continue to your workspace.

or

“We set up our whole workspace in an afternoon.”

NJNusrat Jahan
Head of operations

Settings

Settings

MRMd Rakib Shekhrakib@studio.co
Email notificationsA summary every Monday.
Two-factor sign-inProtect your account with a code.
LanguageUsed across the app.
Delete accountThis removes all your data.

Palette and type

Light

  • Primary#b04f12
  • Accent#ffe6d4
  • Background#fbf7f3
  • Foreground#1b1612
  • Muted#f3ece6

Dark

  • Primary#e97f3f
  • Accent#4f2109
  • Background#1b1612
  • Foreground#fbf7f3
  • Muted#3f3731
  • DisplayUnbounded
  • BodyOnest
  • MonoJetBrains Mono

Editorial Web3 interface: ink-toned warm neutrals, wide Unbounded headlines and one ember action color for on-chain tools.

Colophon Hashmark is one of the Pro presets in UIX. Its tokens, theme files and DESIGN.md come with UIX Pro: in Figma, in code, and through the UIX MCP for AI coding agents.

Access
UIX Pro
Industries
web3, digital publishing, crypto media
Mood
editorial, confident, literate, precise
Display font
Unbounded
Body font
Onest
Mono font
JetBrains Mono
Density
Spacious
Contrast
Standard
Corner radius
6px

Use Colophon Hashmark

On the web

Open it in Studio, change anything, then use it in your app with one CSS link, the CLI or your AI tool.

Use this preset

In Figma

Open UIX, go to Presets and search “Colophon Hashmark”. Press Use this preset, then Sync to Figma.

Install UIX

In code

A Tailwind v4 and shadcn/ui theme, W3C tokens, Figma variables and a DESIGN.md. Included with UIX Pro.

Unlock with UIX Pro

Send to your AI agent

Connect the UIX MCP once, then ask Claude Code, Cursor or any MCP client: “Use the Colophon Hashmark preset”.

Get your MCP link

Similar presets

All 251 presets →