GitHub

Official brand guidance and downloads.

Logos, colors, fonts, guidance, and presentation assets for Aspire.

Start here What's here
  • Brand marks
    2 SVG downloads
  • Core palette
    7 foundation colors
  • Presentation starter
    Spring 2026 deck
What's here

A focused brand kit for everyday use.

This page stays focused: brand assets here, deeper product docs on aspire.dev.

Use this page for

Brand assets

Logo downloads, colors, fonts, guidance, and the current deck.

Browse the kit Go to aspire.dev for

Docs and product context

Deeper explanation, product docs, and supporting content.

Open aspire.dev
Logos

Use the official Aspire marks.

Choose the size that best fits the space, then keep the shape and color relationships intact.

Colors

Core Aspire colors.

Use the core colors most often, then bring in accent colors and gradients when you need more expression without losing recognizability.

Aspire primary

Primary brand accent.

#7455DD

Aspire purple

Stronger companion purple for depth and emphasis.

#512BD4

Aspire secondary

Soft supporting purple for accents and surfaces.

#B9AAEE

Aspire muted

Light lavender for subtle fills and backgrounds.

#DCD5F6

Aspire grey

Neutral support color for quiet surfaces and separators.

#DCE0E8

Aspire black

Dark anchor color for dark themes and contrast.

#1F1E33

Aspire white

Clean base for light surfaces and negative space.

#FFFFFF

Supporting gradients

Use gradients as a controlled highlight. Let them add energy, but keep the surrounding layout calm and readable.

  • Purple to magenta

    Use for hero accents, highlights, or editorial-style flourishes.

    --aspire-gradient-purple-magenta: linear-gradient(90deg, #7455DD 0%, #B30F87 100%);

  • Blue to purple

    Works well for product-led visuals, diagrams, and directional emphasis.

    --aspire-gradient-blue-purple: linear-gradient(90deg, #0078D7 0%, #7455DD 100%);

  • Flamingo to purple

    Bring in warmer energy for campaign moments and bold callouts.

    --aspire-gradient-flamingo-purple: linear-gradient(90deg, #F65163 0%, #7455DD 100%);

  • Purple to cyan

    Use sparingly when the layout needs a cleaner, more technical accent.

    --aspire-gradient-purple-cyan: linear-gradient(90deg, #7455DD 0%, #0B7E84 100%);

Supporting accents

Use these sparingly for diagrams, highlights, editorial moments, or motion accents around the core palette.

  • Accent magenta #B30F87
  • Accent flamingo #F65163
  • Accent blue #0078D7
  • Accent cyan #0B7E84
  • Accent yellow #9B8308
Type

Poppins is the brand typeface.

Use Poppins across headings, interface text, and supporting copy. The site currently ships weights 400, 500, 600, and 700.

Primary typeface

Poppins

Aspire brand kit

Use Poppins for headings, interface text, and supporting brand copy.

Loaded weights

The site currently imports Poppins locally through Fontsource.

  • Poppins Regular 400
  • Poppins Medium 500
  • Poppins Semibold 600
  • Poppins Bold 700
View Poppins
CSS variables

Ready-to-use color tokens.

If you're styling a web experience or demo, start here and trim the block to the tokens you actually need.

Aspire CSS variables

Use this as a clean starting point for implementation.

aspire-brand-tokens.css
:root {
  --aspire-color-primary: #7455dd;
  --aspire-color-purple: #512bd4;
  --aspire-color-secondary: #b9aaee;
  --aspire-color-muted: #dcd5f6;
  --aspire-color-grey: #dce0e8;
  --aspire-color-black: #1f1e33;
  --aspire-color-white: #ffffff;
  --aspire-accent-magenta: #b30f87;
  --aspire-accent-flamingo: #f65163;
  --aspire-accent-blue: #0078d7;
  --aspire-accent-cyan: #0b7e84;
  --aspire-accent-yellow: #9b8308;
  --aspire-gradient-purple-magenta: linear-gradient(90deg, #7455dd 0%, #b30f87 100%);
  --aspire-gradient-blue-purple: linear-gradient(90deg, #0078d7 0%, #7455dd 100%);
  --aspire-gradient-flamingo-purple: linear-gradient(90deg, #f65163 0%, #7455dd 100%);
  --aspire-gradient-purple-cyan: linear-gradient(90deg, #7455dd 0%, #0b7e84 100%);
}
Guidance

A few simple rules go a long way.

The strongest brand systems communicate clearly: they protect the mark, keep the language precise, and let the experience feel approachable.

Do

Use the brand in ways that feel clear, helpful, and consistent wherever people encounter Aspire.

  • Call the product Aspire in brand, editorial, and marketing copy.
  • Use aspire.dev when you need official docs, product explanation, or supporting content.
  • Use the supplied SVG files without redrawing, outlining, or reshaping the mark.
  • Give the logo breathing room and choose high-contrast surfaces that keep it crisp.
  • Keep the tone clear, helpful, direct, and approachable.
  • Let the core purple system lead and use accent colors or gradients as supporting expression.

Do not

Avoid the shortcuts and visual changes that make the brand feel less recognizable or less human.

  • Do not call the product ".NET Aspire" in consumer-facing brand or marketing content.
  • Do not stretch, rotate, recolor, or crowd the logo with partner marks, badges, or dense UI.
  • Do not make gradients or supporting accents carry the whole interface on their own.
  • Do not rely on internal shorthand when a simple reader-facing explanation would be clearer.
Presentation materials

Start from the official intro deck.

This deck is level 100 Aspire content with official branding, meant to give you a clean starting point for talks, demos, workshops, and community sessions.

Aspire Spring 2026 intro deck

A level 100 introduction to Aspire with official branding, ready to adapt as a starting point for talks, demos, workshops, and community sessions.

PowerPoint (.pptx)

Download PowerPoint .pptx
License

Use the artwork broadly. Respect the trademark.

The artwork is open for reuse. The Aspire name and logo remain protected marks.

The artwork in this brand kit is released under CC0 1.0 for broad reuse in decks, blog posts, and other Aspire-related content. Trademark rights are not waived; the Aspire name and logo remain subject to Microsoft's trademark rights and brand review expectations.

View on GitHub
Top