HypeMarket.ai
Brand assets & usage guidelines
Download all assets
SVG marks, PNG icons, and the archived contender. Right-click any image below to save individually.
Logo mark
The primary logo mark is an H formed by two pillars with horn/funnel shapes meeting at center. Orange = creative energy, blue = business. Click any download button to save.
PNG icons (ready to use)
Wordmark lockups
The logo mark paired with the two-tone HypeMarket.ai wordmark. "Hype" in text color, "Market" in #60A5FA blue. Use system font -apple-system/Inter at weight 800.
Compact lockup
Size reference
The mark is designed to be legible from 128px hero down to 16px favicon.
On light
On dark
Color palette
Two-color brand system. Creative energy on the left, business on the right. Click any swatch to copy the hex code.
Primary colors
Neutrals
SVG code
Copy-paste ready. The mark is just 4 elements — two stroked paths (pillars) and two filled polygons (horns).
Light mode
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<path d="M22 20v60" stroke="#F97316" stroke-width="8" stroke-linecap="round"/>
<path d="M78 20v60" stroke="#0A66C2" stroke-width="8" stroke-linecap="round"/>
<polygon points="22,38 50,47 50,53 22,62" fill="#F97316" opacity="0.55"/>
<polygon points="78,38 50,47 50,53 78,62" fill="#0A66C2" opacity="0.55"/>
</svg>Dark mode
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="none">
<path d="M22 20v60" stroke="#FB923C" stroke-width="8" stroke-linecap="round"/>
<path d="M78 20v60" stroke="#70B5F9" stroke-width="8" stroke-linecap="round"/>
<polygon points="22,38 50,47 50,53 22,62" fill="#FB923C" opacity="0.55"/>
<polygon points="78,38 50,47 50,53 78,62" fill="#70B5F9" opacity="0.55"/>
</svg>Usage guidelines
Keep the mark recognizable. It's simple — keep it that way.
Do
- Use the SVG mark at any size from 16px up
- Use the color version on light and dark backgrounds
- Use mono black on light backgrounds when color isn't available
- Use mono white on dark/photo backgrounds when color isn't available
- Maintain clear space around the mark (min 25% of mark width)
- Pair with the wordmark "HypeMarket.ai" in weight 800 — "Market" in #60A5FA blue
Don't
- Rotate, skew, or distort the mark
- Change the colors or opacity values
- Add drop shadows, gradients, or effects
- Place on busy backgrounds without sufficient contrast
- Use the light version on dark backgrounds (use the dark variant)
- Swap which side is orange vs blue
File inventory
All production-ready files with download links.
| File | Location | Size | Use | |
|---|---|---|---|---|
| logo.svg | app/assets/images/ | SVG | Primary mark, light mode | Download |
| logo-dark.svg | app/assets/images/ | SVG | Primary mark, dark mode | Download |
| logo-wordmark.svg | app/assets/images/ | SVG | Wordmark lockup, light mode | Download |
| logo-wordmark-dark.svg | app/assets/images/ | SVG | Wordmark lockup, dark mode | Download |
| logo-mono-black.svg | app/assets/images/ | SVG | Single-color black (print, stamps) | Download |
| logo-mono-white.svg | app/assets/images/ | SVG | Single-color white (dark/photo backgrounds) | Download |
| icon.svg | public/ | SVG | Favicon with dark mode support | Download |
| icon-512.png | public/ | 512x512 | PWA icon, social sharing | Download |
| icon-192.png | public/ | 192x192 | Android/PWA icon | Download |
| apple-touch-icon.png | public/ | 180x180 | iOS home screen icon | Download |
| icon.png | public/ | 512x512 | General fallback icon | Download |
| logo-contender-arrows.svg | app/assets/images/ | SVG | Archived runner-up (4.3c-C) | Download |
Archived contender
Kept for history. The Arrow Overlap H was the strongest runner-up.