# Analytics Dashboard Theme # A modern theme optimized for displaying analytics and metrics data # # Colors chosen for clarity with statistical data visualization: # - High contrast for readability # - Blue for primary data (professional, trustworthy) # - Teal for secondary data (complementary, distinguishing) # - Warm neutral backgrounds for extended viewing [metadata] name = "Analytics Dashboard" description = "Professional theme for analytics dashboards with optimized readability" version = "1.0.0" author = "Rustelo Example Plugin" [colors] # Primary brand colors primary = "#2563EB" # Modern blue - professional and trustworthy secondary = "#14B8A6" # Teal - complements primary for contrast accent = "#F59E0B" # Amber - draws attention to important metrics # Background and surface colors background = "#FFFFFF" # Clean white for maximum readability surface = "#F9FAFB" # Light gray for card backgrounds surface-variant = "#F3F4F6" # Slightly darker for depth # Text colors text = "#111827" # Nearly black for excellent readability text-secondary = "#6B7280" # Medium gray for secondary content text-muted = "#9CA3AF" # Light gray for tertiary content # Status colors success = "#10B981" # Green for positive metrics warning = "#FBBF24" # Amber for warnings error = "#EF4444" # Red for errors info = "#3B82F6" # Blue for information # Data visualization chart-1 = "#3B82F6" # Blue chart-2 = "#10B981" # Green chart-3 = "#F59E0B" # Amber chart-4 = "#EF4444" # Red chart-5 = "#8B5CF6" # Purple chart-6 = "#EC4899" # Pink [typography] # Font selections for clarity with data heading = "Inter, system-ui, sans-serif" body = "Inter, system-ui, sans-serif" mono = "JetBrains Mono, Monaco, monospace" # Scale for consistent sizing font-scale = 1.125 # 12.5% increase per step (1rem * 1.125) [spacing] # Base unit for all spacing base = 8 # px # Semantic spacing increments step = 1.5 # Multiplier for each spacing level (8px, 12px, 18px, 27px, etc) [borders] radius-small = 4 # px - for small elements radius-medium = 8 # px - for cards and buttons radius-large = 12 # px - for large containers radius-full = 9999 # px - for fully rounded elements width-thin = 1 # px - subtle borders width-regular = 2 # px - standard borders width-bold = 3 # px - emphasized borders [shadows] elevation-0 = "none" elevation-1 = "0 1px 2px rgba(0, 0, 0, 0.05)" elevation-2 = "0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06)" elevation-3 = "0 4px 6px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.06)" elevation-4 = "0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05)" [responsive] # Breakpoints for responsive design breakpoint-mobile = 320 # px breakpoint-tablet = 768 # px breakpoint-desktop = 1024 # px breakpoint-wide = 1280 # px breakpoint-ultrawide = 1536 # px [animation] # Transition timings for smooth animations duration-instant = 0 # ms duration-fast = 100 # ms duration-normal = 200 # ms duration-slow = 300 # ms duration-slower = 500 # ms easing-linear = "cubic-bezier(0, 0, 1, 1)" easing-ease = "cubic-bezier(0.25, 0.1, 0.25, 1)" easing-ease-in = "cubic-bezier(0.42, 0, 1, 1)" easing-ease-out = "cubic-bezier(0, 0, 0.58, 1)" [density] # Visual density settings compact = true # Use compact spacing for more information density show-borders = true # Show subtle borders for clarity show-shadows = true # Show shadows for depth [contrast] # Contrast settings for accessibility level = "AA" # WCAG AA standard (minimum) enhanced = false # Can be enabled for WCAG AAA [print] # Print-specific settings optimized = true monochrome = false # Use colors in print (can be changed for cost reduction)