- File:
sections/art-by-color.liquid - Add section category: Collections
- Used in: index
Section settings
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Heading | text | Art by color | ||
| Text | text | Browse by the colors that lead each piece. |
Layout
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Layout | select | Full-width strip, Grid, Swatches | Full-width strip | |
| Columns | range | 2 to 8, step 1 | 4 | Shown when section.settings.layout == 'grid'. |
| Swatch size | range | 64 to 240 px, step 8 | 120 px | Shown when section.settings.layout == 'swatches'. |
| Space between colors | range | 0 to 40 px, step 4 | 12 px | Shown when section.settings.layout != 'strip'. |
| Shape | select | Rectangle, Square, Rounded, Circle, Pill | Rectangle | Shown when section.settings.layout != 'strip'. |
Text
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Text position | select | Bottom left, Bottom center, Center, Top left, Below the color | Bottom left | |
| Text size | select | Small, Regular, Large | Regular |
Effects
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Hover effect | select | None, Lift, Zoom, Show label on hover | None | |
| Entrance animation | select | None, Rise in, one after another, Unveil from the side, Fade in from ink, Settle into place | None | Plays once as the section scrolls into view. Off for visitors who prefer reduced motion and when animations are off in Theme settings. |
| Field height | range | 160 to 480 px, step 20 | 240 px | Shown when section.settings.layout == 'strip' or section.settings.layout == blank. |
| Color scheme | color_scheme | scheme-1 |
Custom colors
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Use custom colors | checkbox | Off | Overrides the color scheme for this section only. | |
| Background | color | #faf6f0 | Shown when section.settings.use_custom_colors. |
|
| Text | color | #2e241b | Shown when section.settings.use_custom_colors. |
|
| Button | color | #2e241b | Shown when section.settings.use_custom_colors. |
|
| Button label | color | #ffffff | Shown when section.settings.use_custom_colors. |
|
| Accent and links | color | #546633 | Keep text and background at a contrast of 4.5 to 1. Shown when section.settings.use_custom_colors. |
|
| Top padding | range | 0 to 160 px, step 4 | 80 px | |
| Bottom padding | range | 0 to 160 px, step 4 | 80 px |
Blocks
Color (up to 8)
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Label | text | Greens | ||
| Field color | color | #6b7b55 | ||
| Text color | color | #ffffff | Use a color with at least 4.5:1 contrast on the field. | |
| Collection | collection | |||
| Link | url | Overrides the collection link, for example a filtered search. |