mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
- Recolor banner/wordmark SVGs to the Otter Orange palette with brand fonts - Rebuild social-preview.png as a hero-style OG card (trust badges, headline, five modality cards with section counts), synced to apps/landing + apps/web og-image.png - Replace static dashboard PNGs with dashboard.gif: a guided tab tour of all 157 tools across the five modalities - Update branding/README.md (Otter Palette, brand fonts, asset list); add scripts/branding generator + sync helpers
2.2 KiB
2.2 KiB
SnapOtter Brand Assets
Press kit for use in blog posts, articles, reviews, and other publications about SnapOtter. Free to use when referencing SnapOtter.
SnapOtter is an open-source, self-hosted file processing suite with 157 tools across image, video, audio, PDF, and file workflows.
Files
| File | Size | Use |
|---|---|---|
logo-512.png |
512x512 | High-res logo with transparency |
logo-256.png |
256x256 | Medium logo |
logo-192.png |
192x192 | Web/PWA icon size |
logo-128.png |
128x128 | Standard logo |
logo-64.png |
64x64 | Small inline logo |
favicon-32.png |
32x32 | Favicon |
logo-512-on-white.png |
512x512 | Logo on white background (no transparency) |
logo-512-on-dark.png |
512x512 | Logo on dark background (no transparency) |
social-preview.png |
1280x640 | OpenGraph / social media preview |
wordmark.svg |
Scalable | "SnapOtter" text mark (dark text) |
wordmark-white.svg |
Scalable | "SnapOtter" text mark (white text, for dark backgrounds) |
banner.svg |
Scalable | Wordmark + tagline banner on dark background |
dashboard.gif |
Animated | Scrolling tour of all 157 tools across the five modalities (README hero) |
Brand Colors
| Name | Hex | Usage |
|---|---|---|
| Otter Orange | #E07832 |
"Otter" in wordmark, buttons, links, CTAs |
| Orange Light | #F09550 |
Hover states |
| Orange Dark | #C06520 |
Text emphasis on light backgrounds |
| Dark Chocolate | #1A1210 |
Dark sections, banner background |
| Foreground | #1A1814 |
"Snap" in wordmark, primary text |
| Cream | #FAFAF7 |
Page / light background |
| Muted | #6B6560 |
Secondary / subtitle text |
Typography
- Headings / brand name: Bricolage Grotesque (weight 800)
- Body text: Instrument Sans
- Code / monospace: JetBrains Mono
Usage Guidelines
- Use the transparent PNG logos when placing on your own backgrounds.
- Use
logo-512-on-white.pngorlogo-512-on-dark.pngwhen transparency is not supported. - Keep the logo proportions intact. Do not stretch or distort.
- Maintain reasonable clear space around the logo.
- The wordmark is always written as "SnapOtter" (capital S, capital O, one word).