Design & brand basics
The files, sizes and colors that make your business look sharp everywhere: logos, photos, fonts, QR codes and print.
Logos & files
Which logo files you need and why: vector and raster, SVG, PNG, favicons, and how to send large files.
- Which logo files should I have, and which do I send you?
Keep a vector master (SVG, EPS, AI or PDF) plus PNG copies with transparent backgrounds. Send us the vector file and any color, black and white versions you have.
- What is the difference between vector and raster images?
Raster images (JPG, PNG, WebP) are made of pixels and blur when enlarged. Vector images (SVG, EPS, AI, PDF) are made of shapes and stay sharp at any size.
- What is a favicon?
A favicon is the small square icon for your site that appears in browser tabs, bookmarks and next to your site in Google results.
- How do I send you large files?
Put the files in a Google Drive, Dropbox or OneDrive folder, share it as a view-only link, and paste that link into a request in your client portal.
Photos
Photos that make your website look great: the right size and format, taking them on your phone, and what you can legally use.
- What is alt text, and how do I write it?
Alt text is a short written description of an image that screen readers read aloud. Describe what the image means on that page in one short sentence.
- How do I take good photos of my business with my phone?
Use soft natural light, clean the lens, hold the phone steady and level, shoot from the angle a customer sees, and take several versions of each shot.
- What image sizes do social platforms use?
Each platform publishes its own sizes and changes them often. Start from a large original, keep key content in the center, and check the platform's current help page.
- What size and format should my website photos be?
Send us the largest original file you have. We convert it to WebP, size it to about twice the space it fills, and never stretch a small photo bigger.
- How do I remove the background from a product photo?
Recent iPhones can lift a subject off its background in the Photos app. For best results, shoot on a plain background in good light, then send us the original too.
- How do I shrink an image without losing quality?
Make the pixel dimensions match where the image will be used, then save with moderate compression. Free tools on Mac, Windows and the web can do both.
- What is WebP, and why do websites use it?
WebP is a modern image format from Google that makes photos and graphics noticeably smaller than JPG or PNG at the same visual quality, so pages load faster.
Colors & fonts
Pick brand colors that are easy to read, find your hex codes, and make sure your fonts are licensed for the web.
- What is a brand kit or style guide?
A brand kit is one place that holds your logo files, colors, fonts and basic rules for using them, so everything you publish looks consistent.
- How do I find my brand colors' hex codes?
Check your logo files or brand kit first. If you have neither, a color picker tool can read the color from your logo on screen.
QR code design
Design QR codes people will scan: contrast, quiet zone, logos and the right printed size for how far away people stand.
- How big should a printed QR code be?
A common rule of thumb is a code at least one tenth as wide as the scanning distance, so a code scanned from 3 feet is about 3.6 inches wide.
- How do I design a QR code people will actually scan?
Use dark modules on a light background, keep a clear border, choose higher error correction if you add a logo, and test on several phones before printing.
Still need help?
Ask our team