Creating Promotional Images for Chrome Web Store

Promotional images are the highest-leverage visual assets you can create for your Chrome extension. While screenshots explain what your extension does, promotional images determine where it gets shown. Google uses them to feature extensions in curated collections, category banners, seasonal promotions, and the Chrome Web Store homepage. Without promotional images uploaded, your extension is invisible to every editorial placement opportunity the store offers.

Yet most developers skip them entirely. They fill in the required fields, upload screenshots, and move on. That single decision -- leaving the promotional image slots empty -- removes their extension from consideration for every single discovery surface beyond organic search. This guide covers every promotional image type, the design principles that make each one effective, and the practical workflows for producing them with tools you already have.

The three promotional image types#

Chrome Web Store supports three promotional image formats. Each serves a different display context, and each has different design constraints. Understanding where each image appears is essential to designing one that works in context rather than in isolation.

All three are optional. But "optional" is misleading. Without them, your extension cannot appear in any editorial or featured placement. Uploading all three maximizes your surface area for discovery.

Small promotional tile: 440 x 280#

The small tile is the most frequently displayed promotional image. It appears in the "Recommended for you" sections, category grids, themed collections like "Work from home essentials" or "Best new extensions," and various algorithmic recommendation surfaces throughout the store.

At 440 x 280 pixels, you are working with a compact canvas. The image needs to communicate your extension's identity and value proposition at a glance, often rendered at sizes smaller than its native resolution when displayed in grid layouts.

Design principles for the small tile#

Lead with your icon and brand name. The small tile is an identity piece first and a marketing piece second. Users scrolling through a grid of tiles are pattern-matching, not reading. Your extension icon should appear prominently, rendered at roughly 64-80 pixels, positioned where the eye naturally lands. Place the extension name adjacent to the icon in a weight that reads clearly at the tile's typical display size.

Use a single background color or subtle gradient. Complex backgrounds compete with the foreground elements for attention. A solid brand color or a gentle two-tone gradient gives the tile visual presence without creating noise. The background should feel intentional and branded, not decorative.

Include one short tagline, not a feature list. You have room for five to eight words below or beside the extension name. This is your elevator pitch compressed to its irreducible core. "Block ads. Browse faster." works. "Advanced AI-powered advertisement blocking with customizable filter lists and whitelist management" does not.

Respect the edge zones. The outer 10-15 pixels on each side are dangerous territory. Different display contexts may crop or mask the edges slightly. Keep all critical content -- text, icon, logos -- inside a safe zone that gives at least 20 pixels of breathing room from every edge.

Small tile layout template#

A reliable layout for the 440 x 280 small tile:

• Background: Solid brand color filling the entire canvas
• Icon: 72x72 pixels, centered horizontally, positioned at roughly 30% from the top
• Extension name: 20-24px bold sans-serif, centered below the icon with 16px spacing
• Tagline: 14-16px regular weight, centered below the name with 8px spacing
• Bottom padding: At least 30px from the lowest text element to the bottom edge

This produces a clean, centered composition that scans instantly in any grid context. The vertical rhythm -- icon, name, tagline -- mirrors how users naturally read: object, label, explanation.

Large promotional tile: 920 x 680#

The large tile appears less frequently than the small tile, but when it shows up, it commands more visual real estate and user attention. Google uses it for mid-page featured placements, larger editorial spotlights, and sometimes in the detail page sidebar when recommending related extensions.

At 920 x 680 pixels, you have significantly more canvas. This is where you can tell a slightly richer story than the small tile allows, but the temptation to overcomplicate is the primary design risk.

Design principles for the large tile#

Expand on the small tile, do not reinvent it. The large tile should be instantly recognizable as belonging to the same extension as the small tile. Same color palette, same icon treatment, same typographic voice. A user who has seen your small tile should feel a spark of recognition when they encounter the large one, not confusion.

Add a UI preview or product shot. The extra space permits including a cropped screenshot or stylized mockup of your extension in action. This is the key differentiator between the large tile and the small tile. Where the small tile is pure brand identity, the large tile can blend identity with proof. Show the extension doing its job inside a clean browser frame.

Scale your typography up, not your word count. The larger canvas means your headline can be set at 32-40px instead of 20-24px, which dramatically improves readability. But resist the urge to add more text. The same five-to-eight-word tagline that works on the small tile works here too. It just gets more room to breathe.

Use asymmetric layouts. Unlike the small tile where centered compositions dominate, the large tile benefits from a split layout. Place the brand elements and headline on one side and the product screenshot on the other. This creates visual flow and gives the eye a path to follow rather than a single focal point.

Large tile layout template#

A proven layout for the 920 x 680 large tile:

• Left side (55% of width): Extension icon at 96px, name in 36px bold, tagline in 18px regular, all left-aligned with generous leading
• Right side (45% of width): A browser window mockup showing the extension popup or content script in action, slightly rotated (2-3 degrees) for visual dynamism
• Background: Brand gradient flowing left to right, darker on the text side for contrast, lighter on the mockup side
• Bottom strip: Optional subtle footer with a small "Available on Chrome Web Store" badge or your website URL

Marquee promotional image: 1400 x 560#

The marquee is the prestige format. It appears at the very top of the Chrome Web Store homepage and at the top of major category landing pages. Earning a marquee placement is partly editorial -- Google's team selects extensions for these spots -- but having the image uploaded is a prerequisite. No marquee image, no marquee placement. Ever.

At 1400 x 560, the aspect ratio is dramatically wide. This is a cinematic canvas, closer to a film frame than a typical web banner. Designs that work at square or portrait ratios fail here. The marquee demands a specifically horizontal composition.

Design principles for the marquee#

Design for the center. The marquee image is sometimes cropped on smaller viewports. The left and right edges are expendable; the center is not. Every essential element -- icon, name, tagline, key visual -- must live within the center 1000 pixels of the 1400-pixel width. The outer 200 pixels on each side should contain only background elements that can be lost without affecting comprehension.

Create a cinematic scene, not an enlarged tile. The marquee's wide ratio invites a narrative composition. Think of it as a movie poster in landscape orientation. You have room for a full product scene: a browser window showing your extension, floating UI elements that highlight key features, and atmospheric background treatment that sets a mood.

Typography must be large and high-contrast. Marquee images render across the full width of the store page. Users are viewing them from a comfortable reading distance, but the image itself competes with everything else on a busy homepage. Your headline should be set at 48-64px minimum, in a high-contrast color against the background. If you cannot read your headline when the image is displayed at 50% zoom, the type is too small.

Tell one story, not three. The width creates a temptation to fill the space with multiple messages or feature callouts spread across the banner. This produces visual clutter that the eye cannot prioritize. Pick the single most compelling angle for your extension and commit to it entirely. One headline, one visual, one message.

Marquee layout template#

A strong layout for the 1400 x 560 marquee:

• Center-left zone (x: 200 to x: 700): Extension icon at 120px, headline in 56px bold, tagline in 22px regular, stacked vertically with generous spacing
• Center-right zone (x: 750 to x: 1200): A large product mockup, browser frame, or composite showing the extension in context
• Full width background: A deep gradient, abstract pattern, or blurred photographic backdrop that unifies the composition
• Safe zone reminder: All critical content between x: 200 and x: 1200 to survive potential edge cropping

Typography that works across all three formats#

Typography is the area where most promotional images go wrong. Developers choose fonts they like at 100% zoom on their design monitor and never check how those fonts render at the actual display sizes the store uses.

Font selection#

Use a sans-serif typeface with a large x-height and open apertures. These characteristics ensure legibility at small sizes and maintain clarity when images are scaled down in grid layouts. Inter, DM Sans, Plus Jakarta Sans, and Manrope are all excellent choices that are freely available from Google Fonts.

Avoid thin or light font weights for any text that needs to be read. On a promotional tile rendered at half its native resolution inside a category grid, a 300-weight font becomes a ghostly suggestion of text. Use medium (500) or bold (700) for headlines and regular (400) for taglines, never lighter.

Text content strategy#

The text on your promotional images should be evergreen. Never include version numbers, release dates, sale prices, or time-sensitive language. These images persist in the store for as long as your extension is published. "New! Version 4.0" becomes embarrassing six months later when you are on version 4.7.

Focus on benefit-driven language. "Save 2 hours every week" is better than "Advanced productivity features." "One-click screenshot capture" is better than "Powerful screenshot toolkit with multiple modes." The constraint of the tile format actually helps here -- there is no room for vague, expansive language. You are forced into clarity.

Color usage and branding#

Color is the single fastest way a user identifies your tile in a grid of competitors. Before they read any text or recognize any icon shape, they see color. Your promotional images should share a consistent color palette with your extension icon and your screenshots, creating a visual throughline across every surface where your extension appears.

Building a promotional color palette#

Start with your primary brand color -- the dominant color in your extension icon. This becomes the background color or primary gradient anchor for all three promotional images.

Add one accent color for emphasis and visual interest. This accent should have enough contrast against the primary to be clearly distinguishable but should still feel like it belongs to the same family. Complementary colors (opposite on the color wheel) create energy. Analogous colors (adjacent on the color wheel) create harmony. Choose based on the personality of your extension.

White or near-white text on a medium-to-dark background consistently outperforms dark text on a light background for promotional tiles. The reason is contextual: the Chrome Web Store's own UI is predominantly white, so a dark-background tile stands out from the page while a light-background tile blends into it.

Colors to avoid#

Pure black backgrounds look harsh and lifeless. Use a very dark shade of your brand color instead (for example, a deep navy rather than #000000). Pure white backgrounds vanish into the store page and make your tile look like a blank placeholder. Neon or extremely saturated colors cause eye fatigue and can introduce color banding in JPEG exports.

Design tool workflows#

You do not need Photoshop to create professional promotional images. Modern design tools offer everything required, and several have features specifically suited to the multi-format nature of promotional image creation.

Figma workflow#

Figma is the recommended tool for most extension developers because of its component and auto-layout system. Create a single source file with three frames at the exact promotional image dimensions. Build your icon, typography, and mockup elements as components, then instance them across all three frames. When you update the icon or tagline, all three images update simultaneously.

Setup steps:

1. Create a new Figma file named "CWS Promotional Images"
2. Add three frames: 440x280, 920x680, 1400x560
3. Import your extension icon as a component
4. Set up text styles for headline and tagline at each size
5. Create your background as a detached element per frame (gradients need manual adjustment per ratio)
6. Export each frame as PNG at 1x

Canva workflow#

For developers without design experience, Canva provides a more approachable path. Use custom dimensions to create each format, apply a brand kit with your colors and fonts, and leverage Canva's built-in mockup templates for browser frames.

The main limitation of Canva is precision. Aligning elements to exact pixel positions is harder than in Figma, and export quality defaults can introduce compression. Always export as PNG and verify the output dimensions match the required sizes exactly.

Browser-based mockup generators#

Several free tools generate browser window mockups that you can composite into your promotional images. These are particularly useful for the large tile and marquee formats where showing the extension in a realistic browser context adds credibility. Take a clean screenshot of your extension in action, run it through a mockup generator to add a browser frame, then place the result into your promotional image composition.

What gets featured: the editorial perspective#

Google's Chrome Web Store editorial team actively curates featured extensions for homepage placements, themed collections, and seasonal spotlights. Understanding their selection criteria helps you design promotional images that serve double duty -- attracting organic users and appealing to the editorial team.

Selection criteria#

Extensions that earn featured placements typically share these characteristics: high user ratings (4.0 or above), consistent update history showing active maintenance, clean policy compliance with no recent violations, and high-quality store assets including all three promotional image sizes.

The editorial team evaluates visual quality explicitly. A poorly designed promotional image disqualifies an otherwise excellent extension from featured consideration. They are curating a storefront experience, and every featured tile reflects on the store's own brand quality.

Seasonal and thematic opportunities#

The Chrome Web Store runs themed collections throughout the year: back-to-school productivity tools in August, holiday shopping helpers in November, new-year organization tools in January. If your extension fits a seasonal theme, having polished promotional images ready means you are eligible when the editorial team assembles that collection.

Monitor the store's homepage monthly to identify recurring themes and plan your promotional image refresh around those cycles. An extension that appears in two or three themed collections per year receives discovery exposure that no amount of SEO optimization can replicate.

Common mistakes and how to avoid them#

The most damaging mistake is uploading promotional images and forgetting about them. Your extension evolves. Your brand matures. Your user base shifts. Promotional images from two years ago may no longer represent your extension accurately. Schedule a quarterly review of all your store assets, including promotional images, to ensure they still tell the right story.

Putting it all together#

The process of creating promotional images is straightforward once you understand the constraints and principles. Start with the small tile since it forces you to distill your message to its essence. Expand to the large tile by adding a product mockup. Then stretch to the marquee by creating a cinematic composition around the same core elements.

Each image you upload expands the set of discovery surfaces where your extension can appear. The small tile alone covers the highest-traffic placements. Adding the large tile opens mid-page editorial features. Adding the marquee makes you eligible for the most premium homepage placement the store offers.

Pair strong promotional images with equally strong screenshots and icons. Your icon design establishes the visual identity that promotional images amplify. Your screenshot set provides the detailed product proof that promotional images tease. Together, these three asset types form a complete visual marketing system for your Chrome extension.

If you are preparing a full store listing from scratch, the Chrome Extension Launch Checklist covers every asset and metadata field required for publishing, so nothing falls through the cracks.

Interactive tool

Screenshot Beautifier

Add device frames, backgrounds, and text overlays to your extension screenshots in seconds.

Open tool

Interactive tool

Listing Audit

Audit your Chrome Web Store listing for missing assets, weak metadata, and optimization opportunities.

Open tool