Brioche - Header Scallop

The Brioche theme includes a decorative scalloped edge beneath the top header row. The scallop is completely optional and can easily be disabled if you prefer!

On mobile devices, the header scallop displays as an accent along the top.

Customize the Header Scallop

To access the scallop settings, go to Appearance > Customize > Brioche Theme Settings > Header Scallop.

In this panel, you'll find the following options:

• Enable Header Scallop: Turn the decorative scalloped edge on or off. If disabled, your top row will display without the scallop.
• Scallop Color: Choose the color of the scalloped edge. You can select a color from your site's Global Palette or choose a custom color.
• Display Scallop on Mobile: Choose whether the scalloped edge should also appear on mobile devices. You can disable it on mobile while keeping it enabled on desktop.
• Mobile Scallop Color: Set a separate scallop color for mobile devices.

Top Row Background Color

For a seamless look, we recommend matching the scallop color to your top row background color. This makes the scalloped edge appear as a natural extension of the header.

To change the top row background color, go to Appearance > Customize > Header. Hover over the Top Row and click on the Top Row settings button. Under the Design tab, you can change the background color to your preferred color.