Design Studio overview
Plan: every plan, including Free. The Advanced tab and saving your own presets need Pro and up.
The Design Studio is where you set how Cove looks on your store: the icon, button style, colours, fonts, labels and translations, the wishlist pages, and the “My wishlist” page in customer accounts. Open it from Design in Cove’s menu.
Everything about Cove’s look is here. The theme editor only holds placement and wiring (which blocks go where, which elements get hearts), and has no icon, colour, size, label or corner settings, so the two can never disagree. See the app embed.
Until you save a design
Section titled “Until you save a design”Until you save a design for the first time, your store shows Cove’s default look: the Minimal preset (outlined heart, red when saved, white background). Your first save also completes the Match your brand step of the setup guide.
The tabs
Section titled “The tabs”The Studio is one Design page with a row of tabs. Each tab is its own page with its own controls; the preview stays beside them.
| Tab | What you set there |
|---|---|
| Presets | Start from a ready-made look, save your own (Pro), or reset to the default. |
| Button | Icon, button style, sizes, corners, shadow, every colour, and typography. |
| Cards | Hearts on product cards, the wishlist link and the save message. |
| Pages | The wishlist page, its empty state and the shared list page. |
| Labels | The words on buttons and messages, per-language overrides, and the “My wishlist” customer account page layout. |
| Advanced | Pro: your own icon, save animation, social proof and custom CSS. |
Saving
Section titled “Saving”Each tab has its own Save Bar. As soon as you change something, Shopify’s Save Bar appears at the top of the admin with Save and Discard.
- Save saves your changes and shows “Design saved”. Your store updates straight away; there’s nothing to publish.
- Discard puts back what was last saved.
- Save one tab before moving to another. If you click a tab or any other link in Cove with unsaved changes, Shopify asks you to save or discard them first.
If a value can’t be saved, the field shows why in red (for example “Between 16 and 48.” or “Use a six-digit hex color, for example #1a1a1a.”), and pressing Save shows a banner: “The design wasn’t saved”. Fix the marked fields and save again.
If the design was saved in another browser tab or window after you opened this page, Save is refused and nothing is saved. Reload the page to get those changes, then make yours again.
The live preview
Section titled “The live preview”Every tab shows a Preview beside its controls, updated as you type. It is built from the same stylesheet your storefront loads, so what you see matches the store. Your theme’s own fonts, buttons and layout aren’t in it; on your store they apply as usual. The preview isn’t interactive.
| Control | Options |
|---|---|
| Show | Product cards and button, Wishlist page, Empty wishlist, Shared list page. Editing a page text switches to the page it belongs to. |
| Width | Desktop (shown at 1100 px wide) or Mobile (390 px), scaled to fit. Your store switches to its mobile layout below 750 px. |
| Page background | Light page or Dark page, to check your colours on both. |
| Reduced motion | What shoppers who ask their device for less motion see: no save animation, no transitions. Starts at your own device’s setting. |
A half-typed colour shows the last saved colour until it’s a complete hex value. The empty wishlist image in the preview is a placeholder; your image is not loaded there.
Contrast warnings
Section titled “Contrast warnings”On the Button tab, Cove checks your colours against the accessibility guidelines (WCAG AA) and shows a Low contrast warning listing each pair that falls short, with its ratio:
| Pair | Aim for at least |
|---|---|
| Icon on the background | 3:1 |
| Saved icon on the background | 3:1 |
| Button label on the button fill (or on the page background, when there’s no fill) | 4.5:1 |
| Message text on the message background | 4.5:1 |
| White badge text (count, price drop) on the saved color | 4.5:1 |
The button label is checked only when you’ve set a label colour. Warnings don’t stop you saving. Switch the preview’s Page background to check the label against a dark page too. Every built-in preset passes.
Everything in the Studio is available on every plan except:
- Saving your own presets (Presets tab): Pro and up.
- The Advanced tab (your own icon, save animation, social proof, custom CSS): Pro and up.
These controls show a Pro badge and stay visible but disabled on lower plans. If you move down from Pro, what you saved is kept and can be switched off, but it stops showing on your store. See Advanced.