Branding & Themes

Launchpad provides comprehensive branding tools to make your developer portal an extension of your brand. From simple logo uploads to AI-powered theme generation, you have complete control over your portal's appearance.

Logo Configuration

Your portal supports multiple logo variants:

• Light Logo — Used in the header navigation in light mode
• Dark Logo — Used in the header navigation in dark mode
• Favicon — Browser tab icon (ICO or PNG)

AI Theme Generator

The AI Theme Generator creates a complete, cohesive theme from your brand assets.

How It Works

1. Upload your logo or provide your brand colors
2. The AI analyzes color relationships and visual style
3. A complete theme is generated including:
   • Primary, secondary, and accent colors
   • Background and surface colors
   • Text hierarchy colors
   • Status colors (success, warning, error)
   • Component variants (buttons, cards, inputs)
4. Preview the theme in real-time
5. Fine-tune individual values if needed
6. Apply the theme to your portal

Theme Modes

Launchpad supports multiple theme modes:

• Light Mode — Optimized for daylight viewing
• Dark Mode — Reduced eye strain in low light
• System — Automatically matches user's OS preference

The AI generator creates both light and dark variants that maintain your brand identity across modes.

Color System

Brand Colors

• Primary — Main brand color, used for CTAs and links
• Secondary — Supporting brand color
• Accent — Highlight color for emphasis

Surface Colors

• Background — Main page background
• Surface — Card and component backgrounds
• Border — Dividers and outlines

Typography

Configure your portal's typography:

Font Families

• Heading Font — Used for titles and headings
• Body Font — Used for paragraphs and UI text
• Code Font — Used for code blocks and technical content

Type Scale

Customize the type scale for consistent hierarchy:

• Display (hero headings)
• H1 through H6
• Body large, body, body small
• Caption and overline

Component Styling

Buttons

• Border Radius — Sharp, rounded, or pill-shaped
• Shadow — None, subtle, or pronounced
• Hover Effects — Color change, lift, or glow

Cards

• Border Style — None, subtle, or outlined
• Corner Radius — Match your brand aesthetic
• Shadow Depth — Flat, raised, or floating

Header & Footer

Header Options

• Navigation Style — Horizontal menu or hamburger
• Search — Enable/disable global search

Footer Options

• Tagline Text — Customize tagline
• Copyright Text — Customize copyright notice

Published changes take effect immediately for all portal visitors.