UIX
Sign in Start free

Presets Delft Stethoscope

Delft Stethoscope

Near-monochrome healthcare UI with warm neutrals, one sapphire accent, muted sage and ochre status colors, and Literata headlines.

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

brand50f3f6fc100e4eaf7200c9d6f0300a4bde64007599d85004f77c46003a5fa87002e4c88800233a689001a2c4e950101d35
neutral50faf8f5100f3f0eb200e4dfd7300cdc6bc400aca4985008e877c600776f647005f5850800443e389002e2a259501c1a17
success50f1f7f2100e0eee3200c2dcc83009cc4a640074a883500518c646003c734f7002e5c3f8002347319001933249500f2016
warning50fcf6ea100f8ebcf200f0d7a2300e3bd72400cfa04a500b2842f600926a2470075541d8005940179003f2d11950271c0a
danger50fdf3f3100fce4e4200f8c8ca300f0a0a5400e5737b500d14a55600b3303d700962631800761e28900561620950370d14

Semantic tokens

Light and dark

Light
background#faf8f5
foreground#1c1a17
card#ffffff
card-foreground#1c1a17
popover#ffffff
popover-foreground#1c1a17
primary#3a5fa8
primary-foreground#ffffff
secondary#f3f0eb
secondary-foreground#2e2a25
muted#f3f0eb
muted-foreground#5f5850
accent#e4eaf7
accent-foreground#1a2c4e
destructive#b3303d
destructive-foreground#ffffff
success#2e5c3f
success-foreground#ffffff
warning#f0d7a2
warning-foreground#3f2d11
border#e4dfd7
input#cdc6bc
ring#4f77c4
Dark
background#1c1a17
foreground#faf8f5
card#25221e
card-foreground#faf8f5
popover#2a2622
popover-foreground#faf8f5
primary#7599d8
primary-foreground#101d35
secondary#443e38
secondary-foreground#f3f0eb
muted#443e38
muted-foreground#cdc6bc
accent#1a2c4e
accent-foreground#e4eaf7
destructive#e5737b
destructive-foreground#370d14
success#74a883
success-foreground#0f2016
warning#cfa04a
warning-foreground#271c0a
border#443e38
input#5f5850
ring#7599d8

Typography

Literata, Nunito Sans and Fira Code

Grow what matters

display-lg · 40/1.1 · 500 · -0.02em
Literata

Grow what matters

display-md · 32/1.15 · 500 · -0.015em
Literata

A calmer way to work

heading-lg · 25/1.3 · 500 · -0.01em
Literata

A calmer way to work

heading-md · 20/1.35 · 600 · -0.005em
Nunito Sans

A calmer way to work

heading-sm · 16/1.4 · 600
Nunito Sans

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

body-lg · 18/1.65 · 400
Nunito Sans

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

body-md · 16/1.6 · 400
Nunito Sans

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

body-sm · 14/1.55 · 400
Nunito Sans

Save changes

label · 14/1.3 · 600 · 0.01em
Nunito Sans

Updated 2 minutes ago

caption · 12/1.45 · 500 · 0.02em
Nunito Sans

const theme = preset("delft-stethoscope")

code · 14/1.5 · 400
Fira Code

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
8px
lg
12px
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 healthcare 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

Delft Stethoscope as a real product

Landing page

delft-stethoscope.com
ProductPricingCustomersDocs
New · healthcare

Delft Stethoscope

Near-monochrome healthcare UI with warm neutrals, one sapphire accent, muted sage and ochre status colors, and Literata headlines.

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#3a5fa8
  • Accent#e4eaf7
  • Background#faf8f5
  • Foreground#1c1a17
  • Muted#f3f0eb

Dark

  • Primary#7599d8
  • Accent#1a2c4e
  • Background#1c1a17
  • Foreground#faf8f5
  • Muted#443e38
  • DisplayLiterata
  • BodyNunito Sans
  • MonoFira Code

Near-monochrome healthcare UI with warm neutrals, one sapphire accent, muted sage and ochre status colors, and Literata headlines.

Delft Stethoscope 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
healthcare, wellness, telehealth
Mood
restrained, refined, calm, reassuring
Display font
Literata
Body font
Nunito Sans
Mono font
Fira Code
Density
Spacious
Contrast
Standard
Corner radius
8px

Use Delft Stethoscope

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 “Delft Stethoscope”. 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 Delft Stethoscope preset”.

Get your MCP link

Similar presets

All 251 presets →