
Preview image. Unlock full-res
Midnight Nebula Canvas
RainbowKit orchestrates a cosmic dark-mode experience with glowing accents. Most surfaces are deep, rich dark grays and blacks, providing a canvas for vibrant, saturated blues, violets, and a spectrum of other hues to punctuate interactive elements and provide visual interest. Typography is compact and precise, maintaining clarity against the dark backdrop. Components favor soft curves and subtle inner shadows, creating a sense of depth and dimensionality without harsh outlines, prioritizing a confident, playful developer-tool aesthetic.
Prioritize Eclipse Black (#000000) for base backgrounds and Cloud White (#ffffff) for primary text on dark themes.
Use Vivid Blue (#0e76fd) as the default for all primary calls to action and interactive elements.
Apply 9999px border-radius for all button elements to create a distinctive pill shape.
Maintain comfortable vertical rhythm with 12px element gaps and 40px section gaps.
Utilize SFRounded as the primary typeface for all textual content, adjusting weights for hierarchy.
Apply the inner shadow rgba(255, 255, 255, 0.12) 0px 0px 0px 1px inset to interactive elements on dark backgrounds for a subtle raised effect.
Reserve specific vibrant colors (like Azure Glow, Flamingo Pink, Volcanic Red) for accent buttons to diversify call-to-action options without diluting the primary brand blue.
Avoid harsh, contrasting outlines on interactive elements; prefer subtle inner shadows or transparent backgrounds.
Do not use generic system fonts for display headings; leverage SFRounded weights for brand consistency.
Do not use #4bd166 for UI elements; it is reserved for decorative SVG fills and not interactive components.
Avoid dense informational blocks; ensure ample spacing (12px elementGap, 40px sectionGap) between components and content.
Do not use box-shadows excessively; only apply the specific tokenized shadows for elevation or interactive states.
Do not introduce new color palettes outside of the defined Brand and Accent colors; decorative gradients should be limited to the defined Gradient Aura Blue and Gradient Ocean.









