Brand & SVG Asset Guide

Color Palette

Primary and semantic colors used across the encyclopedia interface. Optimized for accessibility on light backgrounds.

Logo Variations

Primary mark and wordmark combinations. Use the color version on light backgrounds and the inverse on dark interfaces.

Iconography

Core interface icons. All stroke-based, 2px weight, rounded caps/joins for consistency with the light theme aesthetic.

Typography Scale

System font stack optimized for readability in light interfaces. Consistent hierarchy across documentation and articles.

• Display Heading 40px / 700 / 1.2
• Section Title 28px / 600 / 1.3
• Card / Article Header 20px / 600 / 1.4
• Body Text 16px / 400 / 1.6
• Caption / Meta 14px / 500 / 1.5

Usage Guidelines

Standards for implementing Aevum Encyclopedia assets in light-themed environments.

• SVG Implementation

  Always use inline SVGs for logos and icons. Set width and height explicitly. Use currentColor for stroke fills to inherit text color contextually.

• Light Theme Contrast

  Ensure all text meets WCAG AA standards. Primary text on white must be #1a1a2e or darker. Muted text should not be lighter than #6c757d.

• Clear Space & Scaling

  Maintain a minimum clear space equal to the height of the logo mark around all edges. Scale proportionally; never stretch or distort SVG viewBoxes.

• Accessibility

  Decorative SVGs must include aria-hidden="true". Semantic icons require role="img" and descriptive aria-label attributes.