The Freelance Designer's Essential Online Toolkit
Every tool a freelance designer needs for client work — image optimization, color conversion, favicon creation, and SVG cleanup. No installs required.
Last Tuesday a client messaged me at 9 PM: "Can you send the logo as a 32x32 favicon, a 180x180 Apple touch icon, and also what's the hex code for that blue we used?"
I was on my laptop. No Photoshop. No Illustrator. Just a browser.
Fifteen minutes later, everything was delivered. Here's how.
The "Client Wants Specific Sizes" Problem
This happens constantly. A client needs their hero image at exactly 1200x630 for Open Graph, product photos at 800x800 for their shop, and thumbnails at 150x150 for a grid layout. Three different sizes from one image.
Opening a full design app for a simple resize feels like driving a truck to pick up groceries. You just need something fast and precise.
Drop in your image, set the dimensions, download. Done in seconds. I keep a browser tab pinned for this because it comes up at least twice a week.
Color Code Chaos
Developers ask for hex. Print shops want CMYK. Brand guidelines list RGB values. A client sends you a Pantone number and asks for "the CSS version."
Color conversion sounds trivial until you're doing it for the fifth time in a day. Having a single place to paste any color format and get every other format back is a genuine time-saver.
Pro tip: bookmark your most-used brand colors after converting. Saves the lookup next time.
Favicons Are Weirdly Complicated
A favicon seems simple — it's a tiny icon. But modern browsers and devices actually need multiple sizes: 16x16 for browser tabs, 32x32 for bookmarks, 180x180 for iOS home screens, 192x192 for Android.
Generating all of these from a single source image used to mean opening Photoshop, exporting each size manually, then converting to .ico format. That's 20 minutes of tedious work.
With a favicon generator, you upload once and get every size you need. I include this in every website handoff now.
SVG Cleanup Before Delivery
Illustrator and Figma export SVGs with a lot of baggage — editor metadata, unnecessary groups, inline styles that should be attributes, decimal precision that's way too high.
A 50KB SVG that should be 8KB is common. For a single icon it doesn't matter much. For a set of 40 icons on a page, that's the difference between snappy and sluggish.
Run your SVGs through an SVG optimizer before sending them to developers. They'll appreciate the clean markup, and the smaller file sizes help page performance.
Compressing Client Deliverables
Clients don't care about compression. They care that their website loads fast and their email attachments aren't rejected for being too large.
Before sending any batch of images, I run them through compression. A portfolio of 20 product photos might go from 80MB to 12MB with zero visible quality loss. That's the difference between "this is taking forever to download" and "got it, thanks!"
The Real Workflow
Here's my actual process for a typical client asset delivery:
- Resize to the exact dimensions they specified
- Compress to reduce file size without losing quality
- Convert colors if they need specific format codes
- Generate favicons if it's a web project
- Optimize SVGs before handing off to developers
The whole thing takes maybe 10 minutes for a complete set of assets. No software to install. No subscriptions. Just browser tabs and done.
Why Browser Tools Win for Freelancers
When you're freelancing, every minute of setup is unpaid time. You might be on a client's machine, a coffee shop laptop, or your tablet. Having tools that work in any browser, on any device, without login screens or trial limitations — that's the kind of thing that makes freelancing actually sustainable.
The best tools are the ones you don't have to think about. They just work when you need them, get out of the way, and let you focus on the creative work that clients are actually paying for.