Presets Eclipse Takeout

Eclipse Takeout

Dark-first, near-monochrome food delivery UI with violet-tinted neutrals, one deep violet accent and wide spacing, set in Bricolage Grotesque and Figtree.

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

brand50f5f3ff100ebe7ff200d8d0ff300bcaefc4009d86f55007c5fe86006442d07005233ad80041298a9002f1d669501c1140

neutral50f7f7fa100eeedf3200dddce5300c1c0cc4009c9bac5007e7d8f6006362787004d4c608002e2d3c9001c1b279500e0d15

success50edfaf5100d2f2e6200a9e4d030078d0b240048b8925002a9e796001f84647001d6a50800185440900123f319500a2920

warning50fff9eb100fcefc8200f6dd93300efc762400e2ad35500c78f18600a6710b700835707800624106900432c049502a1b02

danger50fff1f1100ffdfdf200ffc2c2300fc9b9a400f2706f500d94a48600b9302f700962323800761b1c90056141a95037090f

Semantic tokens

Light and dark

Light

background#f7f7fa

foreground#0e0d15

card#ffffff

card-foreground#0e0d15

popover#ffffff

popover-foreground#0e0d15

primary#6442d0

primary-foreground#ffffff

secondary#eeedf3

secondary-foreground#1c1b27

muted#eeedf3

muted-foreground#4d4c60

accent#ebe7ff

accent-foreground#2f1d66

destructive#b9302f

destructive-foreground#ffffff

success#1d6a50

success-foreground#ffffff

warning#f6dd93

warning-foreground#432c04

border#dddce5

input#c1c0cc

ring#7c5fe8

Dark

background#0e0d15

foreground#f7f7fa

card#1c1b27

card-foreground#f7f7fa

popover#1c1b27

popover-foreground#f7f7fa

primary#9d86f5

primary-foreground#1c1140

secondary#2e2d3c

secondary-foreground#eeedf3

muted#2e2d3c

muted-foreground#c1c0cc

accent#2f1d66

accent-foreground#ebe7ff

destructive#f2706f

destructive-foreground#37090f

success#48b892

success-foreground#0a2920

warning#e2ad35

warning-foreground#2a1b02

border#2e2d3c

input#4d4c60

ring#9d86f5

Typography

Bricolage Grotesque, Figtree and JetBrains Mono

Grow what matters

display-lg · 56/1.04 · 500 · -0.03em
Bricolage Grotesque

Grow what matters

display-md · 40/1.1 · 500 · -0.02em
Bricolage Grotesque

A calmer way to work

heading-lg · 28/1.2 · 500 · -0.015em
Bricolage Grotesque

A calmer way to work

heading-md · 20/1.3 · 600 · -0.01em
Figtree

A calmer way to work

heading-sm · 16/1.4 · 600
Figtree

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

body-lg · 18/1.6 · 400
Figtree

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

body-md · 16/1.6 · 400
Figtree

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

body-sm · 14/1.5 · 400
Figtree

Save changes

label · 14/1.25 · 500 · 0.01em
Figtree

Updated 2 minutes ago

caption · 12/1.4 · 500 · 0.02em
Figtree

const theme = preset("eclipse-takeout")

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
3px

md
6px

lg
10px

xl
14px

full
full

Components

Every part, every state

Buttons

DefaultHoverFocusDisabledPrimarySecondaryOutlineGhostDestructive

Inputs

Full namePlaceholder

EmailFocused

PasswordUse at least 8 characters

Team

Design

Opens a menu

WorkspaceDisabled

Message

Navigation

Eclipse TakeoutProductPricingCustomersDocs

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.

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 food delivery report

What changed this quarter, and what to do next.

MRMd Rakib Shekh4 min read

Israt Jahan

Product designer

Customer	Date	Status	Amount
MRMd Rakib Shekh	Mar 12	Paid	2,400.00
NJNusrat Jahan	Mar 11	Pending	860.00
IJIsrat Jahan	Mar 09	Failed	1,120.00

Showing 1–3 of 36

No messages yet

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

Screens

Eclipse Takeout as a real product

Landing page

eclipse-takeout.com

Eclipse TakeoutProductPricingCustomersDocs

New · food delivery

Eclipse Takeout

Dark-first, near-monochrome food delivery UI with violet-tinted neutrals, one deep violet accent and wide spacing, set in Bricolage Grotesque and Figtree.

MRNJIJLoved by 2,000+ teams

This week

+24.6%

Dashboard

Eclipse Takeout

Good morning, Rakib

Overview

Revenue

48,210

+12.4%

Customers

2,318

+4.1%

Churn

1.8%

-0.3%

Revenue

Customer	Date	Status	Amount
MRMd Rakib Shekh	Mar 12	Paid	2,400.00
NJNusrat Jahan	Mar 11	Pending	860.00
IJIsrat Jahan	Mar 09	Failed	1,120.00

Phone app

9:41●●● 100%

Welcome back

Md Rakib Shekh

Balance

12,480

Md Rakib ShekhPaid

2,400

Nusrat JahanPending

860

Israt JahanFailed

1,120

9:41●●● 100%

Q3 launch

Write onboarding copyMd Rakib Shekh · TodayReview new pricingNusrat Jahan · TomorrowShip release notesIsrat Jahan · Friday

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.

Eclipse Takeout

Welcome back

Password

Remember me

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

NJNusrat Jahan
Head of operations

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#6442d0
Accent#ebe7ff
Background#f7f7fa
Foreground#0e0d15
Muted#eeedf3

Dark

Primary#9d86f5
Accent#2f1d66
Background#0e0d15
Foreground#f7f7fa
Muted#2e2d3c

DisplayBricolage Grotesque
BodyFigtree
MonoJetBrains Mono

Dark-first, near-monochrome food delivery UI with violet-tinted neutrals, one deep violet accent and wide spacing, set in Bricolage Grotesque and Figtree.

Eclipse Takeout 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: food delivery, hospitality, luxury retail
Mood: restrained, expensive, calm, nocturnal
Display font: Bricolage Grotesque
Body font: Figtree
Mono font: JetBrains Mono
Density: Spacious
Contrast: Standard
Corner radius: 6px

Use Eclipse Takeout

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 “Eclipse Takeout”. 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 Eclipse Takeout preset”.

Get your MCP link

Similar presets

All 251 presets →