# Layouts & appearance

Source: https://salesdrawer.com/docs/layouts-and-appearance/

> List, grid and compact layouts, the 15 color controls, radius and spacing, seasonal presets and custom CSS.

Sale Drawer’s styles are fully self-contained, so it looks the same under any theme or page builder — Gutenberg, Elementor, Divi, WPBakery and the rest. Everything below is in the free version.

## List, grid and compact layouts

- **List** — image beside the details, with the original price, sale price and savings. The best default for most stores.
- **Grid** — two-up cards with larger images. Great for visual products such as fashion and home goods.
- **Compact** — tight single-line rows: name and prices only. Ideal for large catalogs and for phones.

## The 15 color controls

Fifteen color controls cover the drawer, its product cards, prices, buttons and the launcher, so you can match your brand without touching CSS. Check contrast when you change text or button colors so prices stay easy to read.

## Radius, spacing and shadow

Adjust corner radius, card spacing and drawer shadow to match your theme: square and flat for minimalist themes, rounded and soft for friendlier brands.

## Seasonal presets and custom CSS

One-click seasonal presets — **Black Friday**, **Flash Sale**, **Clearance** and **Holiday** — apply a complete look, and you can tweak any color afterwards. For anything else, add **custom CSS**.