Logo ideas

Chrome extension logo ideas: 16 pixels is the whole game

A Chrome extension ships its logo at three sizes: 128 pixels for the store listing, 48 for the extensions page, 16 for the toolbar where it will spend its entire working life. Most logos fail the third size, and the third size is the product. The samples below are chosen so the same mark survives all three.

Sample kits, rendered live

Every lockup below is a real render from the LogoRay engine for a fictional brand: original mark, open-licensed pairing, working palette. Open any of them in the composer and swap the name for yours.

Tabhalo sample logo lockup
Tabhalo
Tab groups that restore themselves
Space Grotesk + InterCobalt palette
Open in composer
Markhive sample logo lockup
Markhive
Highlight and save quotes from any page
Schibsted Grotesk + InterSky palette
Open in composer
Cornerclip sample logo lockup
Cornerclip
Screenshot and annotate in two clicks
Outfit + OutfitOcean palette
Open in composer
Focusfen sample logo lockup
Focusfen
Blocks distracting sites during deep work
Hanken Grotesk + InterTeal palette
Open in composer
Halfshade sample logo lockup
Halfshade
Dark mode for every site, tuned per domain
Sora + InterCobalt palette
Open in composer
Whirlmark sample logo lockup
Whirlmark
One-click bookmarks with automatic tags
Schibsted Grotesk + InterSky palette
Open in composer
Icons that survive the toolbar

Type the extension name and the composer opens pre-tuned for icon-first brands: single-shape geometric marks, high-contrast palettes, pairings that hold at pinned-icon size. Free to design, watermarked previews included.

Three sizes, one mark

The Chrome Web Store wants a 128 pixel icon, the extensions management page shows 48, and the toolbar renders 16. That is the entire brief, and it is brutal: at 16 pixels you have roughly 250 dark pixels to spend, so the mark must be one shape with one contrast idea. Every sample above passes that filter, and you can watch any candidate fail it honestly in the logo size checker, which renders your mark at exactly these sizes.

Design at 16 and scale up, never the reverse. A mark born at 128 pixels accumulates detail the small sizes cannot carry, while a mark born at 16 stays clean at every size above it. The favicon sizes guide walks through the same discipline for the web side of the brand, and the same master artwork should drive both.

The toolbar is a crowded shelf

A pinned extension sits in a row of other pinned extensions, every one of them a 16 pixel square fighting for recognition. Silhouette wins that fight, not color: users find your icon by shape memory, the ring, the split circle, the pinwheel, before they register hue. That argues for marks with a distinctive outline over marks that are a colored square with detail inside, and it is why the samples lean on strong single silhouettes.

Color still matters as a tiebreaker, and the rule is one saturated hue with real contrast against both light and dark toolbars, since Chrome themes vary. Sky, cobalt and teal hold up; mid-grays and pastels melt into the chrome around them. Test against both toolbar themes before shipping, the same way you would test a favicon.

The store listing borrows trust from the icon

Extension installs are trust decisions: users grant page access to a stranger's code. The 128 pixel store icon is the first credibility check, and store browsers have learned to read sloppy icons as sloppy code. A composed geometric mark with intentional color says maintained; a clip-art puzzle piece or a screenshot-of-a-logo says abandoned in 2019. Same skill, different stakes than a normal app icon.

Keep the icon and the store screenshots in one visual register, same palette, same type in the promotional images, so the listing reads as one product rather than an assembly. The wordmark from these samples belongs on the store banner and the onboarding page; the toolbar gets the mark alone, always.

Common questions

What sizes does a Chrome extension icon need?

Provide 16, 48 and 128 pixel versions: toolbar, extensions page and store listing respectively. Ship all of them from one master mark designed to survive the 16 pixel render, because that is the size users interact with daily after the install decision.

Why does my extension icon look blurry in the toolbar?

Usually the 16 pixel version is a scaled-down photo or a detailed logo rather than purpose-built icon artwork. Redraw the mark as a single bold shape aligned to the pixel grid, export a dedicated 16 pixel version, and check it against both light and dark toolbar themes.

Should a Chrome extension logo include text?

No. At 16 and even 48 pixels text is unreadable decoration that steals space from the mark. Reserve the wordmark for the store banner, promotional tiles and your site; the icon slots should carry a single distinctive shape and nothing else.

What makes a Chrome extension icon recognizable?

Silhouette first: a distinctive outline users can find by shape memory in a row of pinned icons. Then one saturated color that contrasts with both toolbar themes. Detail, gradients and multiple colors all dissolve at toolbar size, so spend the whole budget on one clear shape.

Free to design, $39 once for the files

Clean SVG, favicon and avatar set, palette and type pairing. No subscription, nothing renews.

Make my logo