15five

15five

Preview image. Unlock full-res

Violet-tinged sunrise on white marble

Industrysaas
Palette
#ffffff
#fff2e8
#5e5777
#2f115b
#1a0d3f
#3b1572
#ffdacf
#ff4b11

15Five employs a vibrant, confident design language with clean white canvases, softened cards, and a striking violet-to-pink gradient. Typography is a blend of bold, impactful headlines and accessible body text. The system uses a specific 'hero' violet as its primary accent, contrasted with touches of warm orange and pink, creating an energetic yet grounded feel. Components are lightweight with generous rounded corners, emphasizing an approachable and modern presentation. Use Midnight Indigo (#1a0d3f) for all main headings and primary body text to ensure high contrast and readability. Apply Canvas White (#ffffff) as the default background for all primary page content sections and cards. Implement the 68px border-radius for all button elements, including both filled and outlined variants, to maintain a consistent soft, approachable shape. Utilize Manrope for all functional typography (buttons, nav, body text) and DM Serif Display for major page headings to leverage their distinct roles. Incorporate the Hero Gradient (linear-gradient(90deg, #3b1572 0%, #1a0d3f 100%)) as a background for high-impact sections like hero banners and testimonials. Maintain a comfortable density with an element gap of 20px and a section gap of 24px between major content blocks. Use Accent Violet (#3b1572) as the primary fill color for active buttons and key interactive elements, drawing immediate attention. Avoid using multiple border styles or weights for interactive elements; stick to 1px solid for subtle hints and no border for purely textual links. Do not introduce new typefaces; rely solely on Manrope and DM Serif Display to preserve typographic consistency. Resist using harsh or high-contrast shadows; only apply the soft, diffused shadow (rgba(0, 0, 0, 0.1) 0px 12px 30px 0px) for specific elevated components like link cards. Do not deviate from the established border radii; avoid sharp corners or excessively small radii as they contradict the system's approachable aesthetic. Refrain from using saturated colors other than Accent Violet, Pink Sunset, or Fiery Orange for UI elements; other vibrant hues are reserved for data visualization or illustrations. Do not expand the primary color palette with additional blues, greens, or reds unless they are specifically for semantic status indications (success, error). Avoid arbitrary letter-spacing adjustments; adhere to the defined Manrope letter-spacing values or normal for DM Serif Display.

More like this