07 · Maximalist / Expressive
A complete Maximalist / Expressive brand kit, composed by Brandwright for the fictional brand Fizz — every asset below comes from one brief. Read-only; start your own to refine any part.
brand kit · essential set
Fizz /
The generative core: brief, logo family, palette, typography. Click any filled asset to see all versions.
⚠️ AI-generated — review and refine before shipping. The marks are extracted to SVG/PNG by an AI pipeline, so small imperfections (a stray tone, a slightly-off path, an occasional mis-cropped detail) are possible. Anything off is editable, or just ask the agent to re-generate it.
Strategy
Fizz is a music & culture app for discovering, sharing, and reacting to what's loud right now.
- Industry
- music & culture app
Art direction
flat vector · abstract mark · neutral/vivid/light
Imagery & illustration: flat vector style.
Ask Brandwright to set an audience and a mission to round out the strategy.
Cohesion4/4
Does the identity read as one system? A structural check across voice, art direction, and the mark set.
- met:
Unified personality
one personality drives both voice and visuals
- met:
Art direction set
medium + mark type fixed for the whole brand
- met:
Complete mark system
5/5 logo marks extracted from one brief
- met:
Type pairing set
heading + body chosen as a pair
00
the locked source every asset comes fromLocked brief
The single 16:9 composed source image. Every logo, color, and typeface below is extracted from it — change the brief and the whole kit follows.
1536×1024
.png
versions
brief.png01
5 marks · SVG master + PNG rasterLogo family
bg
mark
1024²
.svg + .png
versions
logos/primary
1024²
.svg + .png
versions
logos/secondary
1024²
.svg + .png
versions
logos/letter-mark
1024²
composed.png
options
logos/app-icon
2048×512
.svg
versions
logos/wordmark◧
every size a browser or OS asks for — and what each is forFavicons & app icons
Browser tab
A purpose-built mark distilled from your logo marks to stay clear in a tiny browser tab.
Fizz×1024²
.png
versions
favicons/faviconApp & home screencomposed
The app-icon tile, sized for iOS, Android & PWA installs.
the maskable icon keeps a safe zone, so any mask (circle/squircle) can’t clip the mark
★
the identity applied — product UI + social cardBrand in use
theme
fizz.com
FizzProductPricingGet started
Welcome to Fizz
The identity applied to a product surface — mark, type, and palette working as one system.
Primary actionSecondary
1200 × 630
social/og-image.pngsocial/ as the brand lockup on the surface color.03
6 rolesColor palette
#F8007DHot Pink
#B6E600Neon Lime
#1236F3Electric Blue
#F8F4EDWarm Off-White
#05080CBlack
#FF5A08Vivid Orange
These colors are mostly easy to read — 1 to adjust.
“Contrast” is how clearly text stands out from the color behind it. When it’s too low, text gets hard to read — especially for people with weaker eyesight or on a bright screen. Here’s what to tweak:
- Text on neutralis a little hard to read.Try this shade instead:
#cdcece
Contrast audit1 text below WCAG 2.1 AA
- text on surfaceAAA18.30:1
- text on neutralfails AA2.72:1suggested fix
#cdcece(4.68:1) - black on primary✓ use this5.29:1
- white on primaryalternate3.97:1
| Pairing | Ratio | Result | Suggested fix |
|---|---|---|---|
| text on surface | 18.30:1 | AAA | — |
| text on neutral | 2.72:1 | fails AA | #cdcece(4.68:1) |
| black on primary | 5.29:1 | ✓ use this | — |
| white on primary | 3.97:1 | alternate | — |
This kit targets WCAG 2.1 AA: every key text/background pairing above is validated and any failure is flagged with a suggested fix. Floor 4.5:1 normal text, 3:1 large. Color is never the only signal.
radial-gradient(at 18% 28%, #F8007D 0px, rgba(248, 0, 125, 0) 55%), radial-gradient(at 80% 22%, #B6E600 0px, rgba(182, 230, 0, 0) 50%), radial-gradient(at 30% 80%, #1236F3 0px, rgba(18, 54, 243, 0) 55%), radial-gradient(at 75% 75%, #FF5A08 0px, rgba(255, 90, 8, 0) 50%), linear-gradient(#F8F4ED, #F8F4ED)04
heading + bodyTypography
heading
Boldonse
Google Fonts
body
Space Grotesk
Google Fonts
pairing in use
Fizz — a headline in the brand face
Body copy set in Space Grotesk. Tuned for legibility at length — the quick brown fox jumps over the lazy dog. 0123456789.
Heading carries the brand’s personality; body is chosen for legibility at small sizes and long form.
05
your palette applied — light & darkTheme
your palette as a light & dark UI theme
Aa — headline
Body copy on the light surface. Muted secondary text.
PrimaryAccentNeutral
Aa — headline
Body copy on the dark surface. Muted secondary text.
PrimaryAccentNeutral
The dark set is derived from your palette and ships ready to use in the kit. For developers: color.dark.* in tokens.json, and @media (prefers-color-scheme: dark) in globals.css.
07
Voice Guide · bundled into the kit zipVoice
Personality
Funny
Serious
Fizz can wink and play with music metaphors, but it should not turn every moment into a joke.
Formal
Casual
The app lives in feeds, reactions, drops, and shares, so it should sound like a sharp friend in the conversation.
Respectful
Irreverent
Fizz can be cheeky about culture and taste, but it should never mock users, artists, or communities.
Enthusiastic
Matter-of-fact
Discovery should feel exciting and alive, while product instructions still need to stay crisp and useful.
Loud, not noisy
Fizz sounds high-energy and culture-aware without shouting over the moment. It uses punchy lines, sharp verbs, and a sense of momentum.
“Your feed just caught a spark. See what’s bubbling.”
In the room
Speak like someone who’s already part of the conversation: current, observant, and quick with context.
“That track is moving fast. Add your take before the room flips.”
Opinion-friendly
Invite reactions without forcing hot takes. Make space for love, debate, surprise, and disagreement.
“Big chorus. Bigger feelings. What’s your read?”
Curated with a wink
Use wit, rhythm, and a little edge, but avoid sarcasm that punches down or makes users feel uncool.
“New drop detected. Your headphones may have opinions.”
Instantly useful
Keep product language clear, short, and action-oriented. The vibe should never get in the way of the next tap.
“Pick a vibe. We’ll tune your feed.”
Messaging
- Audience
- Music-first, culture-curious people who want to know what’s breaking through, see how others are reacting, and add their own take before the moment passes.
- Value
- Fizz helps you discover, share, and react to the music and culture that’s loud right now.
Pillars
Catch the moment early
Fizz surfaces the songs, artists, clips, drops, and conversations gaining heat before they feel old.
React with the crowd
The app turns discovery into participation, giving users quick ways to post takes, respond, and see how the room is feeling.
Taste moves the feed
Fizz learns from what users play, share, skip, save, and react to so the feed feels personal without becoming predictable.
Culture without the gatekeeping
Fizz makes it easy to jump into music and culture conversations whether users are deep in the scene or just catching the spark.
Words we use
loud right nowbubblingcatching firenew dropthe roomyour taketap inon repeatfreshthe feedreactsharediscoverwhat’s movingwhat’s nextturn it upbehind the buzzculture in motionthe momentyour corner of the crowd
Words we avoid
content consumptionuser engagementleverage your networkviral contenttrending assetssynergythought leadershipoptimize your experiencefellow youthslitslayno capbasedcringestan responsiblybreaking news-style seriousnessgatekeepy taste language like real fans onlyengagement bait like you won’t believe thisoverhyped claims like the only music app you need
Voice in action
- onboarding-welcomeWe say: Start with what you’re into. We’ll tune the feed from there.We don’t say: Select your interests to personalize your content recommendations.
- primary-ctaWe say: What’s loud right nowWe don’t say: Trending music and culture
- primary-ctaWe say: This one’s catching heat. Drop your take.We don’t say: This track is becoming popular. Share your opinion.
- notificationWe say: New drop from Nova Vale. The room is already split.We don’t say: Nova Vale has released a new song. Open Fizz to view reactions.
- empty-stateWe say: Nothing on repeat yet. Save a track when it hits.We don’t say: You have not saved any songs. Saved songs will appear here.
- primary-ctaWe say: Send this to someone with taste.We don’t say: Share this item with your friends.
- errorWe say: The feed missed a beat. Check your connection and try again.We don’t say: Unable to load content due to a network connectivity issue.
- successWe say: Keep it about the take, not the person. Edit your comment to post.We don’t say: Your comment violates our community guidelines and cannot be submitted.
- successWe say: Posted. Your take is in the room.We don’t say: Your post has been successfully published.
- onboarding-welcomeWe say: Find your people on Fizz. We’ll only use contacts to help you connect.We don’t say: Allow access to your contacts to improve your social experience.
| Surface | ✓ We say | ✕ We don’t |
|---|---|---|
| onboarding-welcome | Start with what you’re into. We’ll tune the feed from there. | Select your interests to personalize your content recommendations. |
| primary-cta | What’s loud right now | Trending music and culture |
| primary-cta | This one’s catching heat. Drop your take. | This track is becoming popular. Share your opinion. |
| notification | New drop from Nova Vale. The room is already split. | Nova Vale has released a new song. Open Fizz to view reactions. |
| empty-state | Nothing on repeat yet. Save a track when it hits. | You have not saved any songs. Saved songs will appear here. |
| primary-cta | Send this to someone with taste. | Share this item with your friends. |
| error | The feed missed a beat. Check your connection and try again. | Unable to load content due to a network connectivity issue. |
| success | Keep it about the take, not the person. Edit your comment to post. | Your comment violates our community guidelines and cannot be submitted. |
| success | Posted. Your take is in the room. | Your post has been successfully published. |
| onboarding-welcome | Find your people on Fizz. We’ll only use contacts to help you connect. | Allow access to your contacts to improve your social experience. |
Start from this direction.
A bold mark inside a rich, multi-color system — mixed, large type and vivid, high-saturation hues rather than a single accent. High-energy, irreverent, and memorable. For music, entertainment, and youth brands. Start here and refine the full system around your brief.