melabelBrand Guidelines
The melabel brand system.
Everything you need to represent melabel consistently — colors, typography, logos, and shapes.
Identity
Logo & Mark
melabelOn light — icon + black text
melabelOn dark — all white version
Default
On surface
On brand blue
On dark
Logo rules
- ✓ Always lowercase: "melabel" — never "Melabel", "MeLabel", or "me label"
- ✓ On light backgrounds: blue icon + black wordmark
- ✓ On dark backgrounds: all-white version
- ✓ Minimum clear space = height of icon mark on all sides
- ✗ Do not rotate, distort, recolor, or add effects to the logo
- ✗ Do not use the wordmark alone without the icon mark
Color
Core Brand Colors
Primary Blue
CTAs, links, brand identity, eyebrow labels
Highlight Yellow
Badges, accents, excitement — never as body text
Secondary Blue
Illustrations, supporting UI, info state
Brand Black
Text, dark backgrounds
Color
Color Scales
Primary Blue
50
100
200
300
400
500
600
700
800
900
Highlight Yellow
50
100
200
300
400
500
600
700
800
900
Secondary Blue
50
100
200
300
400
500
600
700
800
900
Neutral Scale — slightly warm
#FFFFFF
#F8F8F9
#F0F0F2
#E2E2E6
#C5C5CC
#9696A0
#6E6E7A
#4A4A55
#333340
#1C1C1C
#111114
Typography
Type Scale
Primary — Inter · Secondary (data) — JetBrains Mono
Your music. Your business.
Display / H1
48–64px · 800 · −0.02em
Build something that lasts.
H2
36px · 700 · −0.015em
Release management, simplified.
H3
28px · 700 · −0.01em
THE WORKSPACE FOR INDEPENDENT MUSIC
Eyebrow label
13px · 600 · 0.08em · uppercase · brand blue
melabel is the workspace where releases, promotion, revenue, contracts, and files actually live together.
Body Large
18px · 400 · 1.6 line-height
Distribute music, merch, and videos to every platform that matters. Track revenue streams in one place.
Body
16px · 400 · 1.6 line-height
2,000+ artists · 25M+ streams/month · $0 upfront
Data / Numbers
JetBrains Mono · 600 · used for stats, metrics, code
Brand Elements
Geometric Shapes
Three shapes from the melabel icon mark — circle, triangle, and square — used as low-opacity background accents. On light surfaces: #1724C9 at 0.08–0.12 opacity. On dark: #5A63E6 at 0.10–0.15 opacity.
On light — #1724C9 at 0.08–0.12
On dark — #5A63E6 at 0.10–0.15
Usage
In Context
New Release
Everything You Need to Run a Modern Music Business
melabel brings releases, promotion, and revenue into one workspace.
Tansen AI
Your AI co-pilot for the music business.
Instant answers, smart suggestions, release intelligence — all inside your workspace.
Common UI patterns
Guidelines
Do's and Don'ts
✓ Do
- Use Inter at 800 weight for all H1/display text
- Use JetBrains Mono for metrics, stats, and code
- Use eyebrow labels at 13px, uppercase, 0.08em tracking in brand blue
- Use #F0E100 yellow only for badges and accent elements
- Keep geometric shapes at 0.08–0.15 opacity max
- Use #0A0A0F for Tansen AI dark sections
- Use #F8F8F9 as the default page background
✗ Don't
- Don't use yellow (#F0E100) as body text color — it fails contrast
- Don't mix secondary blue with the primary blue for text
- Don't use dark backgrounds outside of Tansen AI sections
- Don't write "Melabel", "MeLabel", or "me label" — always "melabel"
- Don't use the logo without its minimum clear space
- Don't use system fonts (Arial, Helvetica) — always Inter + JetBrains Mono
- Don't apply opacity to the brand blue primary CTAs
melabel brand system · For questions contact the design team · Always use the latest version of these guidelines