All of Cartavera’s look is set in Appearance → Editor → Styles. There’s no separate theme options panel.
Style variations
A style variation changes the whole palette (and, for some, the fonts) in one click. Go to Appearance → Editor → Styles and pick one under Browse styles.
Cartavera has eight:
| Variation | Notes |
|---|---|
| Default | Dark header, white page |
| Harbor | |
| Graphite | |
| Plum | |
| Fresh Market | |
| Midnight (dark) | Dark page and header. Used by the Electronics starter |
| Atelier | Used by the Fashion starter |
| Orchard | Used by the Grocery starter |
Every variation was checked against WCAG 2.2 AA contrast for text, form fields, icons, star ratings and focus rings, on the storefront pages and every pattern, at desktop and phone widths. If you change colours yourself, check the contrast of your new palette. The WebAIM contrast checker is a quick way to do it: aim for at least 4.5:1 for text.
Midnight and light images
In Midnight, light Cover images behind dark-on-light text are shown at 30 % brightness so the light text stays readable. If one of your banner images looks too dark, give that Cover block its own overlay colour in the editor; banners with an overlay set keep it.
Change colours
Styles → Colors → Palette lists the theme’s colours. Each one has a job, so changing it changes every place that uses it:
| Colour | Used for |
|---|---|
| Base | Page and card background |
| Canvas, Subtle | Section and panel backgrounds |
| Line | Borders and dividers |
| Contrast | Main text |
| Muted | Secondary text |
| Header, Header alt | Header and footer backgrounds |
| On header | Text and icons in the header and footer |
| Accent, Accent strong, Accent soft | Buttons, the cart badge, highlights |
| On accent | Text on accent buttons |
| Hyperlink, Hyperlink hover | Links |
| Deal | Discount badges and sale prices |
| Success | In-stock text and confirmations |
| Rating | Star ratings |
Your changes are saved to your site, not to the theme files, so theme updates don’t overwrite them. To go back to a variation’s colours, pick the variation again, or use Reset in the Styles panel.
Change fonts
Cartavera uses Manrope, which is stored in the theme, so no font is loaded from Google or another server. To change it, go to Styles → Typography and pick another font for text and headings. With WordPress’s Font Library you can add fonts from your computer or from Google Fonts.
If you switch font, Cartavera stops preloading Manrope, so you don’t pay for a font you don’t use.
Product grid density
Product grids are WooCommerce’s Product Collection block. To change how many products a row shows, select the block and change Columns in its settings. Each grid has its own setting.
Block styles
Cartavera adds a few styles to WordPress blocks. Select a block and look under Styles in its settings:
| Block | Style | What it does |
|---|---|---|
| Product Collection | Carousel row | One scrolling row with previous and next buttons |
| Product Collection | Image tiles | Large image tiles |
| Group (the header’s outer group) | Sticky compact header | Keeps the header at the top. See Headers and footers |
| Columns | Card grid | Each column becomes a card |
| List | Checklist | Ticks instead of bullets |
| Heading | Section title | The section heading style used on the homepage |
Custom CSS
For small changes, use Styles → ⋮ → Additional CSS. For larger changes, or anything you want to keep under version control, use a child theme.
Cartavera’s colours are available as CSS variables, for example var(--wp--preset--color--accent), so your CSS can follow the palette and still work when you switch variation.