Softween Style Guide
Brand colors and design tokens for the Softween visual identity
Color Palette
Pink
Pink
Primary gradient start, vibrant accent
Cyan
Cyan
Primary gradient end, tech energy
Indigo
Indigo
Accent color, depth and sophistication
Background
Background
Deep space background
Surface
Surface
Card and component backgrounds
Text
Text
Primary text on dark backgrounds
Brand Gradients
Primary Gradient
Primary Gradient
Main brand gradient - pink to cyan
Cosmic Gradient
Cosmic Gradient
Multi-stop cosmic gradient
Surface Gradient
Surface Gradient
Subtle background variation
Typography on Brand Colors
Surface Background
This is how text appears on the surface background color. It provides excellent readability while maintaining the cosmic aesthetic.
Primary Gradient Background
Text on the primary gradient creates high impact and draws attention to key messaging and call-to-action elements.
Indigo Accent Background
The indigo accent color provides depth and sophistication for secondary content areas and feature highlights.
Usage Guidelines
Primary Colors
- • Pink (#FF66C8) - Call-to-action buttons, highlights
- • Cyan (#1FB6FF) - Links, interactive elements
- • Indigo (#4830F0) - Accent cards, secondary actions
Background System
- • Background (#050515) - Main page background
- • Surface (#0B0B1E) - Cards, modals, components
- • Text (#E6E8F9) - Primary text content