Chrome Web Store Assets Generator

Generate all required icons and promotional tiles for the Chrome Web Store — instantly, in your browser.

🌐 Live Demo · 📚 Official Chrome Docs · 🤝 Contributing · 🐛 Report Bug

Chrome Web Store Assets Generator is a free, open-source, browser-based tool that takes your extension's logo and automatically generates every icon size and promotional tile required by the Chrome Web Store — all in one click, with no server, no upload, no sign-up.

Built with React, TypeScript, Vite, and the HTML5 Canvas API. All processing happens 100% client-side.

• One-click generation — upload your logo once, get all assets instantly
• All official sizes — icons (16×16, 32×32, 48×48, 128×128) and promotional tiles (Small, Large, Marquee)
• Customizable banners — set your extension name, subtitle, and pick from gradient palettes
• Adjustable icon padding — fine-tune spacing with a live preview
• Store Preview tab — see how your listing will look on the Chrome Web Store
• Manifest v3 snippet — copy-paste-ready manifest.json icons block
• ZIP download — download all assets at once, organised into icons/ and banners/ folders
• 100% client-side — nothing leaves your browser; no API key needed for image generation
• Dark/light gradients — multiple palettes to match your brand

The table below lists every image asset the Chrome Web Store can use and whether this tool generates it automatically.

Note: Screenshots must be manually crafted to showcase your extension's actual UI. All other assets can be generated by this tool.

Source: Chrome Web Store developer documentation

The quickest way to run the tool without cloning the repository. Requires Docker.

docker run -d -p 3000:80 --name assets-generator paladini/chrome-web-store-assets-generator:latest

Open http://localhost:3000 in your browser.

To stop and remove the container:

docker stop assets-generator && docker rm assets-generator

Ideal for self-hosting alongside other services.

Create a docker-compose.yml file:

services:
  app:
    image: paladini/chrome-web-store-assets-generator:latest
    ports:
      - "3000:80"
    restart: unless-stopped

Then run: docker compose up -d

git clone https://github.com/paladini/chrome-web-store-assets-generator.git
cd chrome-web-store-assets-generator

docker compose up -d --build

Open http://localhost:3000 in your browser.

Prerequisites: Node.js 18+

# Clone the repository
git clone https://github.com/paladini/chrome-web-store-assets-generator.git
cd chrome-web-store-assets-generator

# Install dependencies
npm install

# Start the development server
npm run dev

Open http://localhost:3000 in your browser.

npm run build

The output will be in the dist/ folder. Serve it with any static file server.

1. Upload your logo — drag & drop or click the upload area. Any image format is supported (PNG, SVG, JPG, WebP). Recommended minimum: 512×512 px for best results.
2. Customise — adjust icon padding, set your extension name and subtitle, and choose a gradient colour palette for the promotional banners.
3. Generate — assets are generated automatically as you make changes. Switch between the Icons, Banners, and Store Preview tabs.
4. Download — click Download All (.zip) to get a ZIP archive organised into icons/ and banners/, or download individual files.
5. Add to your manifest — use the Manifest Snippet to copy the ready-to-use icons block into your manifest.json.

Contributions are welcome and appreciated! Please read CONTRIBUTING.md before opening a pull request.

# Fork the repo, create a feature branch
git checkout -b feature/your-feature-name

# Make your changes, then run type-checking
npm run lint

# Open a PR against main

Distributed under the MIT License. See LICENSE for more information.

Fernando Paladini — @paladini

If this project saved you time, consider giving it a ⭐ on GitHub!