The wrxstack logo,
in every shape it lives.
Mark, wordmark, four lockups, plus tile-format square, banner, favicon, and app icon, each tuned to a specific surface (light, dark, coral, single-color print). Drop SVG straight into product, marketing, decks, swag, or platform stores. This page tells you which file to reach for, when, and why.
Pick the right logo
in five seconds.
Match the surface (where it lives) to the form factor (the available shape). The matrix below is the canonical answer; the rest of this document is the long version. When in doubt, use the horizontal lockup, light, it works on most surfaces.
| Surface | Available shape | Use this file | Variant |
|---|---|---|---|
| Light theme (paper, white, cream) | Wide | /logos/horizontal/logo-horizontal-light.svg | Primary |
| Light theme | Square / narrow | /logos/stacked/logo-stacked-light.svg | Stacked |
| Dark theme (ink, charcoal, navy) | Wide | /logos/horizontal/logo-horizontal-dark.svg | Primary |
| Dark theme | Square / narrow | /logos/stacked/logo-stacked-dark.svg | Stacked |
| Coral surface (signature blocks, swag) | Any | /logos/horizontal/logo-horizontal-mono-paper.svg or /logos/banner/logo-banner-coral.svg | Mono white |
| Photography / busy bg | Any | /logos/horizontal/logo-horizontal-mono-paper.svg (over scrim) | Mono only |
| Single-color print (deboss, screen, fax) | Any | /logos/horizontal/logo-horizontal-mono-ink.svg | Mono ink |
| Browser tab | 16-64 px | /logos/favicon/favicon.svg | Mark only |
| App store / launcher (iOS, Android, PWA) | Square 1024 | /logos/app-icon/app-icon-ink.svg | Default |
| Social avatar (X, LinkedIn, GitHub) | Square | /logos/square/logo-square-ink.svg | Default |
| Social cover image (LinkedIn header) | 3:1 banner | /logos/banner/logo-banner-ink.svg | Default |
| Email signature | Tiny wide | /logos/horizontal/logo-horizontal-light.svg @ 24 px tall | Horizontal |
| Slide deck title slide | Wide | /logos/horizontal/logo-horizontal-light.svg | Primary |
| Sponsorship / billboard | Square | /logos/square/logo-square-coral.svg | High impact |
The mark.
The 5-bar stacked silhouette inscribed in a rounded tile. Use the mark on its own only when the wordmark is already present elsewhere in the same view (e.g. a header next to a favicon tab). For all other standalone uses, choose a lockup.
Use notes
- mark-ink.svg: default. Use on light surfaces above 24 px.
- mark-paper.svg: for dark surfaces where the tile should read paper-on-ink.
- mark-coral.svg: signature moments only (sponsorship, swag, billboard).
- mark-white.svg: bars-only, no tile. Use over an existing colored background.
- mark-glyph.svg: the bars without the tile, for inline SVG sprites.
The wordmark.
Set in Bricolage Grotesque 600, lowercase, tight tracking. The x takes the signature coral. Use the wordmark alone as the long logo; never recreate it in another font.
Use notes
- Use the color wordmark (with coral x) whenever the brand is the subject of the page.
- Switch to mono when the surface is single-color (deboss, screen, fax, regulated industries).
- Never recreate the wordmark by typing it in a different font, the optical-size and tracking will not match.
- Minimum size: 14 px digital, 10 mm print.
Horizontal lockup.
Default for everything wide, web headers, email headers, slide masters, conference signage. Mark on the left at cap-height, wordmark to the right. Locked, never break apart.
Use notes
- Default for web header (60-80 px height), email banner, doc letterhead.
- The mono paper variant is the go-to for coral surfaces and photography (with a soft scrim).
- Minimum width: 120 px. Below that, switch to the stacked lockup or the mark alone.
Stacked lockup.
For square-ish placements where the horizontal lockup would crop or overrun. Mark above, wordmark below. Use as the square-tile version of the brand in product cards, app stores, and marketplace listings.
Use notes
- Use when the available width is narrower than the horizontal lockup would need.
- Minimum height: 64 px. Below that, switch to mark only.
- Wordmark sits directly below the mark with a 12% mark-height gap.
Square tiles.
Three master square logos: ink (default), paper (light), and coral (signature). For containers that demand a 1:1, social avatars, dashboard cards, marketplace listings, app icons.
Use notes
- logo-square-ink.svg is the default for every social avatar (X, LinkedIn, GitHub, YouTube, Slack workspace).
- logo-square-coral.svg is reserved for sponsorship and high-impact placements.
- Tile uses 14% corner radius. Mark sits inside the inner 60% of the canvas.
Banner tiles.
3:1 banner format for LinkedIn covers, OG cards, conference banners, and email mastheads. Three variants, ink (default), paper, coral.
Use notes
- Banner, ink is the default LinkedIn / X header.
- Banner, coral is reserved for high-visibility moments, launches, sponsorships, billboards.
- Aspect ratio locked at 3:1. Mark + wordmark composition does not adjust with crop.
App icons and favicons.
For iOS, Android, PWA, and browser tabs. The mark stays inscribed in the platform's safe area. iOS uses 22.5% squircle; Android adaptive uses circular safe zone; web favicon uses 14% rounded square.
Use notes
- app-icon-ink.svg is the default for App Store, Play Store, and PWA install.
- iOS handles the squircle automatically; Android requires foreground + background layers if you ship adaptive icons.
- Favicon ships as a single SVG that respects the user's color-scheme preference.
What to use on every background.
A surface-by-surface answer for the four most-common backgrounds. If your surface isn't shown, default to the horizontal lockup, light.
→ Horizontal, light, with coral x
→ Horizontal, dark, with coral x
→ Mono paper, never color-on-color
→ Mono paper, with scrim underneath
Don't crowd the mark.
Clear space around the mark equals one bar-height (4.5u, ≈ 22% of the mark's height). The wordmark requires the x-height of its lowercase as clear space around all sides. Type, photo edges, color blocks, keep them out.
Minimum sizes
The four most-common violations.
Full list of don'ts in brand guidelines. These four are the easiest to get wrong.
Every file, every path.
All 27 SVG masters in the logo kit, organized by family. Click any filename to download. For the complete asset inventory (formats, dimensions, use), see the brand inventory.
Brand & design
support.
If a placement isn't covered here, email contact@wrxstack.com with where and how you want to use the logo, and we will get back to you.