CURATED · OPEN · FREE

Magic Eden

A high-energy, dark-mode marketplace for buying, selling, and discovering NFTs.

web3nft

↓ Download design system (8 MB)Open in OpenDesign

Visit: https://magiceden.io

📦 Browse pack contents →

Identity DNA

NFTMarketplaceSolanaTradingWeb3

A neon-lit bazaar for digital collectibles

Color

#ea4141Accent

#f2f2f3Ink

#858094Ink soft

#15111dBG

#1e1929BG soft

#2a2337BG quiet

#4d3d5cMuted

rgba(35, 30, 47, 1)Line

Deep purple-black background with bright white text and vibrant neon pink and green accents.

Typography

grotesque-sans · monospace

display24px · 700
body16px · 400
caption12px · 400

Use Inter as the primary sans-serif for UI. · Use bold weights for headings and emphasis.

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Standard 4px grid system.

Surfaces

sm · 4px

md · 8px

lg · 12px

pill · 999px

1px solid #231e2f

0px 1px 2px 0px rgba(0, 0, 0, 0.05)

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

Responsive grid for collection cards and tables.

Motion & Interaction

150msmicro

200mssmall

400msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

Smooth transitions for hover states and UI updates. · Carousel sliding for featured sections.

Subtle color shifts or border highlights on cards and buttons. · Immediate feedback with opacity changes.

Components

button Rounded buttons with solid fills (pink for primary actions) or subtle borders.
card Dark cards with subtle borders and rounded corners (8px) for NFT collections.
chip Pill-shaped tags and status indicators (e.g., 'Featured', 'Top').
input Dark-themed input fields with subtle borders.
hero Horizontal scrolling carousel of featured collection cards.

Voice & Don'ts

Tone Direct, professional, and focused on utility.
Headlines Short, punchy, and bold.
CTAs Action-oriented (e.g., 'Buy Packs', 'See all').

Don't use a light background — the screenshot shows a dark purple-black interface.
Don't use serif fonts — the screenshot shows a clean, modern sans-serif style.
Don't use rounded corners everywhere — the screenshot shows sharp, 8px radii on cards.
Don't use multiple dominant colors — the screenshot shows a restrained palette with pink and green accents.
Don't use dense, cramped layouts — the screenshot shows generous spacing and clear visual hierarchy.
Don't use subtle, low-contrast borders — the screenshot shows clear, dark borders to separate elements.
Avoid: Vague terminology
Avoid: Overly complex sentences
Avoid: Passive voice

Inside the pack — real screenshots

Magic Eden — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

Magic Eden is a leading Solana NFT marketplace designed for a web3-savvy audience. It features a dark mode interface with a deep purple-black background (#15111d) and vibrant accents like neon pink (#ea4141) and green (#41e78a). The typography uses a clean grotesque sans-serif (Inter) with bold headings and 16px body text. Key components include collection cards with 8px radius, pill-shaped tags, and a horizontal carousel for featured items. Avoid using light themes, serif fonts, or overly decorative elements. The design prioritizes clarity, trust, and ease of navigation for trading digital assets.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

en · zh-CN · zh-TW · ja · ko