
Preview image. Unlock full-res
Midnight kinetic canvas
GSAP uses a dynamic 'dark playground' aesthetic, where a deep black canvas provides a dramatic stage for vibrant, evolving highlight colors and bold, unconventional typography. The system emphasizes clear content hierarchy through stark contrast, with interactive elements outlined in subtle, near-white tones rather than filled. The overall impression is one of sophisticated, high-performance tooling for creative animation. Use Absolute Zero (#0e100f) as the default background for all pages and primary content sections. Prioritize Frosted Canvas (#fffce1) for all primary text and interactive elements to ensure high contrast on dark backgrounds. Apply Mori font with variable letter-spacing, using the tighter tracking values for larger display text (e.g., -0.0200em for 224px display text) and standard tracking for body copy. Employ the 100px border-radius for all primary buttons and navigation items to maintain a distinct pill-shaped interactive element. Integrate brand accent colors (Neon Pink, Fiery Orange, Shocking Green, Digital Violet, Aqua Glow, Mint Burst) in graphical elements, animated components, and section highlights using 2px borders. Maintain a comfortable density with element gaps typically at 16px, and card padding at 16px for content blocks. Outline interactive elements like buttons and input fields rather than filling them, using Frosted Canvas (#fffce1) for borders to keep the primary background clean. Avoid using solid background fills for primary action buttons; instead, opt for outlined styles with Frosted Canvas borders. Do not introduce new color palettes; stick to the defined brand accents and neutral scale. Never use generic square or rounded-square buttons; all primary interactive elements should leverage the 100px border-radius for the signature pill shape. Resist adding unnecessary elevation or shadows; the design relies on flat surfaces and vibrant color outlines for visual interest. Do not deviate from the Mori font or introduce other font families; all textual content must use Mori to maintain brand consistency. Avoid overly bright or light background sections; the design system is anchored in a dark theme where brighter elements serve as accents. Do not use generic gray text for headlines or section titles; they should always be Frosted Canvas (#fffce1) or a specific brand accent color for emphasis.









