Independent app guide
Color Swatch Pug setup guide.
You probably arrived from the app's App Store listing, which still links here. This page covers what the app does today, how to install it and switch on its theme app embed, what to check when swatches don't show, and how to remove it cleanly, plus Shopify's free native swatches as an alternative. App facts were checked on October 23, 2026.
What the app is today.
Read from the app's Shopify App Store listing and Store Leads on October 23, 2026. They change; the listing is the place to confirm them.
| Publisher | Bitfrills solutions inc., listed in Mohali, PB, India Source: Shopify App Store listing. |
|---|---|
| In the App Store since | November 9, 2017 Source: Shopify App Store listing. |
| Price | $6.99 a month on a single plan (csp pro), charged in US dollars every 30 days Source: Shopify App Store listing. |
| Free trial | 14 days; there is no free plan Source: Shopify App Store listing. |
| Rating | 4.6 out of 5 from 55 reviews: 47 five-star, 1 four-star, 2 three-star, 1 two-star and 4 one-star Source: Shopify App Store listing. |
| Stores using it | About 132, according to Store Leads (report updated October 16, 2026), which also shows a 25% drop over the past year and a peak of about 555 in March 2021 Source: Store Leads install report. |
| Built for Shopify | No Source: Shopify App Store listing. |
| Language | English Source: Shopify App Store listing. |
| Former name | Collection Swatch Pug; the App Store address still uses collection-swatch-pug Source: Wayback Machine, July 2020 capture of this domain. |
What it does
Color Swatch Pug shows color swatches, or small pattern images, for a product's variants on collection pages and on product pages. On a collection page, shoppers see every color a product comes in without opening it; on the product page, swatches replace the theme's own option buttons or menu.
The listing also says you can change how the selector looks and hide sold-out options, and that setup is a single switch. It advertises support 24 hours a day, six days a week. It doesn't name any supported themes, and it has no Works with section.
The three newest reviews, read on October 23, 2026, are a mixed set: a five-star review from January 16, 2026 praising help with setting up colors, a one-star review from December 13, 2024 reporting duplicated variant names after renaming variants and slow support, and a five-star review from November 27, 2024.
Install the app.
-
Open the App Store listing
Search the Shopify App Store for Color Swatch Pug and open its listing. Make sure you are signed in to the store you want it on, then click Install.
-
Approve the access and the charge
Review the access the app asks for and approve it. Then approve the $6.99 monthly charge; the first 14 days are a free trial, and Shopify adds app charges to your Shopify bill.
-
Give color variants their own images
The setup guides on this domain from 2018 to 2020 said a variant only got a swatch if it had its own variant image. Whether today's version still needs that isn't published, but assigning an image to each color variant does no harm, and it lets the photo change when a shopper picks a swatch.
-
Set your colors in the app
Open the app from Apps in your Shopify admin. The listing says you can set a color or a pattern image for each variant, style the selector and hide sold-out options. The setting names aren't published anywhere we could find, so follow the app's own screens.
-
Switch on the app embed
The app shows nothing until its embed is on in your theme. The next section covers it step by step.
Turn on the theme app embed.
Since 2022 the app has worked through a theme app embed rather than code you paste into your theme. The steps below follow the app's own 2022 and 2024 setup pages, as archived, in our words; current names in the app may differ.
-
Open your themes
In your Shopify admin, go to Online Store > Themes. In the 2024 admin layout this sits under Sales channels > Online store.
-
Open the theme editor
On the theme that should show swatches, click Customize (newer admins call it Edit theme). To test safely, use a duplicate of your live theme.
-
Find the app embed
Click the App embeds icon in the left sidebar of the theme editor. In the 2022 layout, App embeds sat under Theme settings at the bottom of the editor.
-
Switch on Color swatch app
Find the embed named Color swatch app and switch it on. Choose where swatches should show: the collection page, the product page, or both.
-
Save and preview
Click Save, then preview a collection and a product with several colors. If nothing shows, see Troubleshooting below.
The two switches
- Collection page
- Shows each product's available colors on product cards in collection grids, so shoppers can see the range before they click.
- Product page
- Replaces the theme's option buttons or dropdown with swatches on the product page.
If the embed doesn't work with your theme, the old guides told merchants to contact the publisher for a manual setup, which could involve giving collaborator access. Use the support channel on the App Store listing for that today.
Collection page or product page: which switch to use.
The two switches do different jobs, and you don't always need both.
- Collection page on, product page off suits current themes that already show native swatches on the product page but not on product cards, such as Dawn. You keep Shopify's swatches where they already work and add the app only where the theme has a gap.
- Both on suits vintage themes such as Debut, which can't draw native swatches anywhere. Turn off any swatch setting in the theme so shoppers don't see two pickers.
- Product page only suits stores that want a different look from the theme's picker and keep collection grids simple.
Each switch you turn on loads the app's script on that page type, so leaving one off where you don't need it keeps that page lighter.
Troubleshooting.
-
Swatches don't appear after setup
Check that the Color swatch app embed is on in the theme you're looking at, not just your live theme or just a duplicate, and that you saved. Then clear your browser cache or open a private window; the old guides pointed to browser caching when recent changes didn't show.
-
Some colors have no swatch
Give each color variant its own variant image. The app's earlier versions only made a swatch for variants with an image, and it's still the first thing to check.
-
Swatches appear a moment after the page loads
The old guides noted that the app's script loaded after the rest of the page, so swatches could appear a moment late. Turn the embed off on page types where you don't need swatches, keep pattern images small, and use one swatch app rather than two. If the store was set up by hand with the 2018 to 2020 guides, also remove the old script tag described under Uninstall and clean up, so the script doesn't load twice.
-
Swatches stopped after a theme update or a theme change
App embeds are switched on per theme. When you publish an updated copy or a different theme, open App embeds in that theme and switch Color swatch app on again. One 2022 review reports the app stopping after a move to an Online Store 2.0 theme until support fixed it.
-
Two sets of swatches on the product page
Your theme is drawing Shopify's native swatches and the app is drawing its own. Turn one off: either the app's product page switch, or the swatch setting in your theme's variant picker. Your theme's page in these guides names that setting.
-
Variant names repeated after renaming colors
A December 2024 review reports duplicated variant names after renaming variants. If you rename colors, check a product page afterwards, and contact the publisher through the App Store listing if names repeat.
Uninstall and clean up.
-
Switch off the app embed
In each theme where you used it, open the theme editor, click App embeds, switch off Color swatch app and save.
-
Uninstall the app
In your Shopify admin, go to Settings > Apps, open the menu next to Color Swatch Pug and choose Uninstall. Shopify says this cancels future recurring charges, though the current billing cycle may still be charged, so ask the publisher about a refund before you uninstall if you want one.
-
Remove leftover code from manual installs
Shopify notes that some apps leave code in your theme after you uninstall them. Stores that installed this app by hand between 2018 and 2020 will have small edits to remove; see the list below. Duplicate the theme before you delete anything.
-
Turn your theme's own swatches back on
If your theme supports native swatches, switch them on in its variant picker so shoppers keep seeing colors. Your theme's page in these guides has the steps.
Leftover code from manual installs
Open Online Store > Themes, choose Edit code on a duplicate of your theme, and search the files for each item below. You'll only find them if the app was set up by hand using the old guides.
| File | Look for | What to do |
|---|---|---|
| templates/product.liquid, and any other product templates | a hidden div with the id hiddenProductId and a data-product-id attribute | Delete the whole div. |
| the product card snippet (product-card-grid in Debut) | a product-selector attribute on the card's outer div | Delete just that attribute and leave the div. |
| layout/theme.liquid | a script tag loading /tools/csp/csp.js, just before the closing body tag | Delete the script tag. |
| the theme's main stylesheet (Debut only) | a .product-form rule that sets align-items to flex-start, between two comments | Delete the rule, unless your product form layout depends on it. |
The native alternative.
Shopify has had its own color swatches since early 2024. You link a product's Color option to the Color category metafield, and themes that support swatches draw them with no app, no script and no monthly charge. Dawn added support in version 13, and Theme Store rules now require listed themes to support swatches on product options.
Where native swatches fall short is the collection grid. Shopify covers the product page and filters, and product cards are up to each theme: Horizon, Impulse and Symmetry have a card setting, Dawn doesn't. Vintage themes such as Debut can't show native swatches without code.
So the app still earns its place on vintage themes and on current themes without card swatches. On a theme that covers both pages natively, you may not need it at all. The color swatch guide hub explains the three routes, and each theme page says which fits.
Other swatch apps.
Prices and ratings from each App Store listing on October 23, 2026. The full table, with fourteen apps, is on the color swatch guide hub. See the full table.
| App | From | Rating | Note | Checked |
|---|---|---|---|---|
| GLO Color Swatch Variant Image | $9.90/month | 4.9 (1,906 reviews) | Free plan includes collection-page swatches. | October 23, 2026 |
| Swatchy ‑ Color Swatches | $8.99/month | 4.6 (25 reviews) | Free plan for one product; Built for Shopify. | October 23, 2026 |
| OP Color Swatch Variant Images | $11.90/month | 5.0 (802 reviews) | Replaces the product-page picker; 30-day trial. | October 23, 2026 |
| Rubik Variant Images & Swatch | $25/month | 5.0 (495 reviews) | Variant photo galleries with swatches. | October 23, 2026 |
| Platmart Color Swatches | $9.99/month | 5.0 (144 reviews) | Joins separate products into one swatch picker. | October 23, 2026 |
| FB Variant Image, Color Swatch | Free | 5.0 (43 reviews) | Free, with no paid plans. | October 23, 2026 |
This site is not affiliated with any of these publishers, and the links are plain links.
Theme-by-theme guides.
Every theme guide covers the native, app and code routes. The first group replaces the theme guides this domain published for the app's earlier versions.
The themes this domain covered for the app
- Venture (retired theme)
- Venue (paid theme)
- Supply (retired theme)
- Pop (retired theme)
- Minimal (retired theme)
- Brooklyn (retired theme)
- Debut (retired theme)
- Simple (retired theme)
- Narrative (retired theme)
- Boundless (retired theme)
- Masonry (paid theme)
- Icon (paid theme)
- Jumpstart (retired theme)
- District (paid theme)
- Envy (paid theme)
- Empire (paid theme)
- Loft (paid theme)
- Broadcast (paid theme)
- Pacific (paid theme)
- Impulse (paid theme)
- Dawn (free shopify theme)
- Capital (paid theme)
- Symmetry (paid theme)
Every other theme
- Horizon (free shopify theme)
- Atelier (free shopify theme)
- Dwell (free shopify theme)
- Fabric (free shopify theme)
- Heritage (free shopify theme)
- Pitch (free shopify theme)
- Ritual (free shopify theme)
- Savor (free shopify theme)
- Tinker (free shopify theme)
- Vessel (free shopify theme)
- Sense (free shopify theme)
- Craft (free shopify theme)
- Crave (free shopify theme)
- Refresh (free shopify theme)
- Ride (free shopify theme)
- Studio (free shopify theme)
- Taste (free shopify theme)
- Colorblock (free shopify theme)
- Publisher (free shopify theme)
- Spotlight (free shopify theme)
- Origin (free shopify theme)
- Trade (free shopify theme)
- Rise (free shopify theme)
- Motion (paid theme)
- Expanse (paid theme)
- Streamline (paid theme)
- Showcase (paid theme)
- Palo Alto (paid theme)
- Prestige (paid theme)
- Impact (paid theme)
- Focal (paid theme)
- Warehouse (paid theme)
- Be Yours (paid theme)
- Turbo (paid theme)
- Flex (paid theme)
- Kalles (paid theme)
- Ella (paid theme)
- Express (retired theme)
Questions app users ask.
Is this the official Color Swatch Pug website?
No. This site is independent and isn't affiliated with Bitfrills solutions inc., the app's publisher. The domain changed hands in September 2026. For help with the app, use the support channel on its App Store listing, or Settings > Apps > Get support in your Shopify admin.
How much does Color Swatch Pug cost?
On October 23, 2026 it had one plan, csp pro, at $6.99 a month with a 14-day free trial and no free plan. Shopify bills it every 30 days with your other app charges.
Why don't swatches show after I install the app?
Usually the app embed is off. Open the theme editor for the theme you're viewing, click App embeds, switch on Color swatch app for the collection page, the product page or both, and save. Then clear your browser cache and check each color variant has its own image.
Does Color Swatch Pug work with Dawn and other Online Store 2.0 themes?
It runs through a theme app embed, and Shopify says app embeds work with any theme version. The listing doesn't name supported themes, so test it on a duplicate during the 14-day trial. On Dawn, using it only for collection pages avoids two sets of swatches on the product page.
Do I still need the app now that Shopify has native swatches?
It depends on your theme. Most current themes show native swatches on the product page for free, but some, such as Dawn, have no swatches on collection product cards, and vintage themes like Debut have none at all. Those are the cases where an app still helps.
How do I remove Color Swatch Pug completely?
Switch off the Color swatch app embed, uninstall the app in Settings > Apps, then search your theme code for hiddenProductId, product-selector and csp.js. Those only exist if the app was installed by hand with the 2018 to 2020 guides; delete them on a duplicate theme first.
Sources.
The app facts come from its listing; the setup steps follow the app's own archived guides from this domain, in our words, and Shopify's Help Center.
Pages we read
- Shopify App Store: Color Swatch Pug listing
- Shopify App Store: Color Swatch Pug reviews, newest first
- Shopify App Store: Color Swatch Pug publisher page
- Store Leads: Color Swatch Pug install report (updated October 16, 2026)
- Shopify Help Center: apps in your theme (app embeds and app blocks)
- Shopify Help Center: uninstalling apps
- Shopify Help Center: adding color swatches using category metafields
- Wayback Machine: the app's setup guide on this domain, July 2020 capture
- Wayback Machine: the 2018 Debut setup guide on this domain, July 2020 capture
- Wayback Machine: the app embed setup page on this domain, August 2022 capture
- Wayback Machine: the setup help page on this domain, July 2024 capture
- Shopify App Store: GLO Color Swatch Variant Image listing
- Shopify App Store: Swatchy ‑ Color Swatches listing
- Shopify App Store: OP Color Swatch Variant Images listing
- Shopify App Store: Rubik Variant Images & Swatch listing
- Shopify App Store: Platmart Color Swatches listing
- Shopify App Store: FB Variant Image, Color Swatch listing
Not sure you still need the app?
Your theme may already draw Shopify's own swatches. Each theme guide says which route fits.