A brand kit is the small set of files that makes your store, social profiles and packaging look like one business: a logo in a few versions, a color palette, two fonts and some rules for using them. Designers deliver one with every identity project. This tool gives you a solid starting kit in a few minutes, built in your browser with nothing uploaded.
What is a brand kit?
A brand kit is a short, shareable package of your visual identity: logo files, color codes, fonts and simple rules for using them. Brand guidelines are the written part of it, explaining how and where each element is used. Together they keep your store, packaging, social posts and emails consistent, whoever makes them.
How to make a brand kit with this tool
- Type your brand name and an optional tagline. Everything updates as you type.
- Pick an industry and a personality. The personality sets the color logic (for example, luxury uses deep shades, often with a gold accent, playful uses bright triadic colors) and the font pool.
- Open Colors and click a palette. Each shows primary, secondary, accent, dark and light colors, with contrast ratios and AA or AAA badges.
- Open Fonts and pick a heading and body pairing.
- Open Logos, click the concept you like best and star any others you want in the ZIP. Switch the preview between light and dark backgrounds.
- Click the lock on any palette, font pair or logo, then Regenerate to get new options for everything else.
- Check the Brand guide tab, then click Download brand kit (ZIP).
Industries and personalities
There are 22 industries, from fashion, beauty and coffee to pets, finance and real estate, and eight personalities: modern, luxury, playful, natural, bold, minimal, techy and classic. The industry steers the starting colors, and the personality sets how colors are combined and which font families are offered. Try two or three personalities: the same name can look like a premium candle house or a fun gift shop.
What a brand kit contains
| File | What it is for |
|---|---|
| Logos (SVG) | Sharp at any size. Use for your website, print and packaging. Separate versions for light and dark backgrounds. |
| Logos (PNG, 1024 px) | For apps and platforms that do not accept SVG. Includes light, dark and transparent versions. |
| palette.css and palette.json | Your colors as CSS variables and as data for developers and design tools. |
| colors.txt | HEX, RGB and HSL values plus contrast results, for printers and freelancers. |
| fonts.txt | Google Fonts links, embed code and CSS for both fonts. |
| Social images | A 400 x 400 profile image and covers for Facebook (851 x 315), X (1500 x 500), YouTube (2560 x 1440) and LinkedIn (1584 x 396). |
| brand-guide.html | A one-page style guide that shows the logo, colors, contrast checks, fonts and usage rules. |
Contrast matters because many shoppers read on phones in bright light. WCAG 2 asks for at least 4.5:1 for normal text (AA), 3:1 for large text and icons, and 7:1 for the stricter AAA level. Black on white is 21:1. The badges tell you which pairs are safe for body text and which are only for headlines, buttons or decoration.
The fonts are free on Google Fonts, and most use the SIL Open Font License, which allows commercial use. The SVG logos refer to the heading font by name. Install that font on your computer, or convert the text to outlines in a design app, so the logo looks the same everywhere. The PNG files are already rendered and need nothing extra.
How to use your brand kit on Shopify
- Go to Settings > General, find Brand assets and click Manage. Add the default logo, a square logo (the 1024 px monogram PNG works well), your primary and secondary colors and your slogan. Themes, sales channels and apps that use Shopify's brand settings pick these up.
- Go to Online Store > Themes, click Customize, and upload the logo in the header section. Use the transparent PNG or the SVG.
- Open Theme settings. Under Colors, enter your HEX values. Under Typography, choose your fonts if they are in Shopify's font picker, or the closest match if not.
- Make a favicon from your monogram with the favicon generator.
If you still need a web address, the domain name generator checks which names are free. For a content site instead of a store, the AI Site Builder in AM Jarvis builds a complete niche site, and you can apply your colors and fonts to its theme.
Social profiles
Most platforms show profile pictures as a circle, so the 400 x 400 image keeps the mark centered with space around it. The cover images keep the logo inside a central safe zone, because every platform crops covers differently:
- Facebook: 851 x 315. Phones crop the sides, so keep text in the middle.
- X: 1500 x 500. Your profile photo covers part of the lower left.
- YouTube: 2560 x 1440. Only the middle 1546 x 423 area shows on every device (YouTube lists it as 1235 x 338 on its 2048 x 1152 minimum size).
- LinkedIn: 1584 x 396 for a personal profile. The profile photo overlaps the lower left.
To make other sizes, such as a Pinterest pin or an Etsy banner, open the PNGs in the image resizer.
Keep your brand consistent
- Use one primary logo and the monogram only where space is small: favicons, app icons and profile pictures.
- Stick to two fonts. Use the heading font for titles and buttons and the body font for everything else.
- Use the accent color sparingly for sale badges and highlights. If everything is highlighted, nothing is.
- Keep product photo backgrounds, email templates and packaging inserts in the same palette.
- Share brand-guide.html with anyone who designs for you, so they do not have to guess.
A worked example
A new dog treat brand, Barkery Lane, types its name and the tagline "Baked small, loved big", picks Pets and Playful, and gets bright palettes. Say the first one uses a coral primary whose badge reads AA large: that coral is fine for buttons and headlines on white, but not for body text. They lock the second palette, where the dark color passes AAA for text, pick a rounded heading font with a clean sans body, and star two logo concepts. Regenerate refreshes only the unlocked fonts and logos. The ZIP gives them SVG and PNG logos, a 400 x 400 profile image, four cover images and brand-guide.html to send to the packaging printer.
Who uses this generator
- New Shopify and Etsy sellers who need a consistent look before launch.
- Side projects and test brands that do not justify a designer yet.
- Freelancers producing mood boards and starting points for client briefs.
- Niche site builders giving each site its own colors and fonts quickly.
Troubleshooting
- The SVG logo shows a different font. The heading font is not installed on that computer. Install it from Google Fonts or use the PNG files.
- A palette looks dull on your screen. Colors vary between screens. Check the HEX values on a phone and a laptop before you print.
- A long name looks cramped. Try another logo concept, or use the monogram version where space is small.
When to hire a designer
A generated kit is a good start for a new store, a side project or a test brand. Hire a designer when you are about to print packaging in volume, raise money, apply for a trademark on the logo, or when your brand needs a custom illustration, a hand-drawn mark or a custom typeface. Give them this kit as a brief so they start from what you already like.
Warning: Simple geometric logos and common words can look like marks that other businesses already own. Search your name and logo in the USPTO Trademark Search system, and in the WIPO Global Brand Database if you sell abroad, before you print anything.