UIX

Presets Cypress Interview

Cypress Interview

Restrained recruiting UI: near-monochrome green-grey neutrals, one deep juniper accent and spacious layouts for careful hiring decisions.

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

Color

Five ramps, 50 to 950

brand50f2f8f4100e0efe5200c2dfcb30095c7a440066a97f500418a5e6002f6f497002458388001b4229900112d1b9500a1d11
neutral50f5f7f6100e8ecea200d3dad6300b4bdb8400949f9950077827c60059645e70046504b800333c389001d2420950111613
success50edf8f4100d3f0e5200aae0cc30078c9ab4004aae8a5002a94706001d7859700156046800104c389000a382895006241a
warning50fdf6e8100fae8c4200f2d396300e0b76c400c99a3e500ab7d146008d660c700715107800563d049003d2b02950261a00
danger50fff4f5100ffe3e7200fdc6cf300f99dae400ef6c88500da446b600c02d567009c2043800791432900580722950390012

Semantic tokens

Light and dark

Light
background#f5f7f6
foreground#111613
card#ffffff
card-foreground#111613
popover#ffffff
popover-foreground#111613
primary#245838
primary-foreground#ffffff
secondary#e8ecea
secondary-foreground#1d2420
muted#e8ecea
muted-foreground#59645e
accent#e0efe5
accent-foreground#112d1b
destructive#c02d56
destructive-foreground#ffffff
success#156046
success-foreground#ffffff
warning#f2d396
warning-foreground#3d2b02
border#d3dad6
input#b4bdb8
ring#418a5e
Dark
background#111613
foreground#f5f7f6
card#1d2420
card-foreground#f5f7f6
popover#1d2420
popover-foreground#f5f7f6
primary#66a97f
primary-foreground#0a1d11
secondary#333c38
secondary-foreground#e8ecea
muted#333c38
muted-foreground#b4bdb8
accent#112d1b
accent-foreground#e0efe5
destructive#ef6c88
destructive-foreground#390012
success#4aae8a
success-foreground#06241a
warning#c99a3e
warning-foreground#261a00
border#333c38
input#46504b
ring#66a97f

Typography

IBM Plex Serif, IBM Plex Sans and IBM Plex Mono

Grow what matters

display-lg · 56/1.08 · 400 · -0.022em
IBM Plex Serif

Grow what matters

display-md · 40/1.15 · 400 · -0.016em
IBM Plex Serif

A calmer way to work

heading-lg · 28/1.25 · 500 · -0.01em
IBM Plex Serif

A calmer way to work

heading-md · 20/1.35 · 500 · -0.006em
IBM Plex Sans

A calmer way to work

heading-sm · 16/1.4 · 600
IBM Plex Sans

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

body-lg · 18/1.6 · 400 · -0.002em
IBM Plex Sans

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

body-md · 16/1.6 · 400
IBM Plex Sans

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

body-sm · 14/1.5 · 400 · 0.002em
IBM Plex Sans

Save changes

label · 14/1.25 · 500 · 0.005em
IBM Plex Sans

Updated 2 minutes ago

caption · 12/1.4 · 500 · 0.02em
IBM Plex Sans

const theme = preset("cypress-interview")

code · 14/1.5 · 400
IBM Plex Mono

Spacing · radius · shadow

The quiet rules

0.52px
14px
1.56px
28px
312px
416px
520px
624px
832px
1040px
1248px
1664px
2080px
2496px
sm
2px
md
4px
lg
8px
xl
12px
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 recruiting 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

Cypress Interview as a real product

Landing page

cypress-interview.com
ProductPricingCustomersDocs
New · recruiting

Cypress Interview

Restrained recruiting UI: near-monochrome green-grey neutrals, one deep juniper accent and spacious layouts for careful hiring decisions.

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#245838
  • Accent#e0efe5
  • Background#f5f7f6
  • Foreground#111613
  • Muted#e8ecea

Dark

  • Primary#66a97f
  • Accent#112d1b
  • Background#111613
  • Foreground#f5f7f6
  • Muted#333c38
  • DisplayIBM Plex Serif
  • BodyIBM Plex Sans
  • MonoIBM Plex Mono

Restrained recruiting UI: near-monochrome green-grey neutrals, one deep juniper accent and spacious layouts for careful hiring decisions.

Cypress Interview 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
recruiting, hr tech, professional services
Mood
quiet, refined, calm, confident
Display font
IBM Plex Serif
Body font
IBM Plex Sans
Mono font
IBM Plex Mono
Density
Spacious
Contrast
Standard
Corner radius
4px

Use Cypress Interview

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 “Cypress Interview”. 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 Cypress Interview preset”.

Get your MCP link