Nova Dashboard — Sunset Light Variant
The Nova Sunset Light Variant is a warm, energetic, and professional SaaS dashboard design. It features a sophisticated 'sunset' color palette of orange and amber accents set against a soft cream-white background. Optimized for AI learning platforms, research tools, fintech, and knowledge management systems, the design utilizes a fixed left sidebar and a high-legibility bento-grid layout. Key characteristics include Satoshi typography, subtle 3D transforms on cards, and soft-glow input fields that enhance the user focus during deep work sessions.
Summary
A clean, warm-toned light-mode dashboard for AI-driven workspaces. It uses a sunset-inspired orange-to-amber gradient for primary actions and active states, balanced by a minimal cream-white base and soft, elegant shadows.
Style
The style is defined by its 'Sunset Light' aesthetic: a mix of cream backgrounds (#f8f7f5) and high-energy orange gradients. Typography uses the 'Satoshi' font family for a modern, geometric look. Icons are thin-line Lucide variants, and interactive elements feature micro-interactions like 2px vertical translations and subtle shadow expansions. Color palette: Cream White (#fcfcfb), Page Background (#f8f7f5), Primary Orange (#ea580c), Amber Glow (#f59e0b), and Soft Gray Text (#6b7280).
Layout & Structure
A two-column layout featuring a fixed 280px sidebar on the left and a fluid, center-aligned main content area constrained to 1200px. The main content is divided into a header, an oversized search/input hero, a quick action grid, and a document library.
Sidebar Navigation
Header Section
Core AI Input Section
Quick Actions Grid
Document Library Grid
Components
Sunset Action Button
A high-impact CTA button with a specific gradient and shadow profile.
Interactive Glow Input
A search/text area that feels 'alive' when active.
Special Notes
MUST maintain the high-contrast between the soft cream backgrounds and the vivid orange interactive elements. DO NOT use sharp black (#000000); use Gray-800 (#1f2937) for headers and Gray-500 (#6b7280) for body text. All container corners should be generously rounded (at least 24px for main sections).