⌕
Upgrade ◐

Discover

Audio‑reactive visualizer · WebGL canvas 905×396

For You v5.5
▶
Neon Skyline
synthwave · 1.2M plays
▶
Deep Current
ambient · 840k plays
▶
Golden Hour
indie pop · 610k plays
▶
Midnight Static
lo-fi · 430k plays
▶
Violet Machine
electronic · 390k plays
Made with Studio
1 Paper Lanterns 2:51
2 Slow Tide v5.5 3:12
3 Static Bloom remix 2:07
Controls: pill buttons, round icon buttons, pink CTA
Pill button · #252529, radius 9999, h40, 15/500, padding 8px 16px
Extenddefault
Extendhover: lighten to #2e2e33
Extenddisabled: muted #6a6a72
Accent CTA · pink #fd429c fill, cream-bright label
+ Createdefault
+ Createhover: glow wash 25%
+ Createdisabled
Round icon button · padding 8px square-round
♡default
♡hover
♡disabled
▶play: cream circle
Search field · surface pill, muted placeholder
⌕
default
⌕
focus: pink outline + glow ring
Chips, badges and tags
v5.5 Synthwave Ambient Lo‑fi radius 4 tag radius 2 tag
Typography: Neue Montreal, even functional weights
Section header · Neue Montreal · 16–18px · 600 · tracking 0Made with Studio
Card title · Neue Montreal · 15–16px · 500–600 · tracking 0Neon Skyline
Body · Neue Montreal · 15–16px/1.4 · 400 · tracking 0Body text at 16px, warm cream on cool dark.
UI / button · Neue Montreal · 15px · 500 · tracking 0Extend · Remix · Create
Meta / caption · Neue Montreal · 12–13px · 400 · tracking 0, graysynthwave · 1.2M plays
Marketing display · Neue Montreal · 40–64px · 500–600 · tracking −2%Make a song
Palette: cool near-black + warm cream text; hot pink accent
Cool-dark neutrals
bg#101012
surface#252529
surface hover#2e2e33
surface-alpha4% white
overlay0,0,0,.3
border8% white
Text: warm cream
cream#f7f4ef
cream-bright#fcfbf9
gray#a3a3a3
muted#6a6a72
Accent and brand gradient
pink#fd429c
pink glow253,66,156,.25
teal#27455c
brand sweep#f8441b→#fd429c
Depth & elevation: radius scale
9999px
pills, controls
16px
feed panels
12px
album art, tiles
6px
small chips
4px
tiny tags
2px
tiny tags
h40
pill height
Elevation recipes: no box-shadows captured
Shadow recipe: none. DESIGN.md §8 records no box-shadows on this surface. Elevation is flat and layered: #252529 and 4% white sit on the #101012 canvas, separated by rgba(255,255,255,.08) hairlines. The ladder below is the real recipe: backdrop-filter glass over album art, plus a pink glow behind active items.
level 0 · canvas #101012
level 1 · panel 4% white, r16
level 2 · surface #252529
level 3 · hover #2e2e33
backdrop blur(16px)
backdrop blur(25px)
backdrop blur(52px)
pink glow wash 25%
Motion
App‑snappy: 75ms color/background/border/opacity on cubic‑bezier(0.4, 0, 0.2, 1) is the signature speed; everything stays ≤200ms (top 0.1s, background‑color 0.15s ease, opacity and transform 0.1‑0.15s), with a wave 1.6s infinite waveform pulse (live in the hero and the playing row above) and a pink glow on generating tracks.