Files
SnapOtter/branding/README.md
T
SnapOtterandGitHub 5b86eaa2c5 chore(branding): multi-modal press kit, hero OG + dashboard.gif (#323)
- 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
2026-06-22 19:51:35 +08:00

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.png or logo-512-on-dark.png when 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).