Brand Color System

A meticulously crafted palette designed for versatility, emotional impact, and digital excellence across all PRISM Studio touchpoints.

Primary & Accent Colors

Core identity colors used for branding, CTAs, and key visual moments.

Prism Violet
#A855F7 📋
RGB: 168, 85, 247
HSL: 271°, 100%, 65%
CMYK: 32, 66, 0, 3
Usage: Primary Brand
Use for primary buttons, key headings, and brand-forward elements.
Prism Rose
#F472B6 📋
RGB: 244, 114, 182
HSL: 332°, 85%, 70%
CMYK: 0, 53, 26, 4
Usage: Secondary / Highlights
Ideal for secondary actions, hover states, and creative accents.
Prism Sky
#38BDF8 📋
RGB: 56, 189, 248
HSL: 200°, 93%, 60%
CMYK: 77, 24, 0, 3
Usage: Accent / Trust
Perfect for info tags, links, and calming interface elements.
Prism Gold
#FACC15 📋
RGB: 250, 204, 21
HSL: 49°, 97%, 54%
CMYK: 0, 18, 92, 2
Usage: Sparse Accent
Use sparingly for badges, awards, and high-emphasis alerts.

Neutral System

Foundation palette for layouts, typography, and UI structure.

Void Black
#0A0A0F 📋
RGB: 10, 10, 15
HSL: 240°, 33%, 5%
Page background, primary canvas.
Surface Dark
#13131A 📋
RGB: 19, 19, 26
HSL: 240°, 15%, 8%
Cards, modals, elevated surfaces.
Panel Gray
#1C1C27 📋
RGB: 28, 28, 39
HSL: 240°, 12%, 13%
Inputs, borders, subtle dividers.
Muted Text
#8888A0 📋
RGB: 136, 136, 160
HSL: 240°, 10%, 58%
Secondary text, captions, metadata.
Cloud White
#F0F0F5 📋
RGB: 240, 240, 245
HSL: 240°, 24%, 95%
Primary text, headings, high contrast elements.

Brand Gradients

Dynamic color transitions for hero sections, overlays, and premium UI states.

Prism Spectrum
linear-gradient(135deg, #a855f7, #f472b6, #38bdf8)
Neon Bloom
linear-gradient(135deg, #f472b6, #a855f7)
Digital Aurora
linear-gradient(135deg, #38bdf8, #a855f7)

Accessibility & Contrast

WCAG 2.1 compliance checks for text readability across brand colors.

Cloud White on Void Black
15.4:1
AAA Pass
White on Prism Violet
7.2:1
AA Large / AAA
Black on Prism Rose
5.8:1
AA Pass
Black on Prism Sky
4.9:1
AA Pass
White on Muted Text
5.6:1
AA Pass
Black on Prism Gold
3.8:1
AA Fail (Decorative Only)

Application Guidelines

How to implement the palette effectively across digital products.

UI Components

  • Primary Buttons: Prism Violet + Cloud White text
  • Secondary Buttons: Outline + Prism Rose hover
  • Links & Tags: Prism Sky with subtle underline
  • Inputs & Cards: Surface Dark with Panel Gray borders

Typography

  • H1-H3: Cloud White (#F0F0F5)
  • Body & Captions: Muted Text (#8888A0)
  • Highlights & Quotes: Prism Violet
  • Sparse Emphasis: Prism Gold

Do's & Don'ts

  • Do use gradients sparingly for impact
  • Do maintain 4.5:1 contrast for body text
  • Don't use Prism Gold for critical info
  • Don't mix more than 3 brand colors per screen
Copied to clipboard!
"}