Design changes control how your site looks, not what it says. The Website Editor separates design from content so you can experiment freely without rewriting your pages.
Global design vs section design
Some design choices apply to your entire site, while others apply only to a single section.
Global design controls include:
Color palettes
Fonts
Themes
Section design controls include:
Layout options for individual sections
Section-specific visual styles
Understanding this difference helps you avoid unexpected changes.
Themes: the foundation of your site’s design
Themes define the overall design structure of your site.
They control things like:
Whether elements are light or dark
How navigation, buttons, and backgrounds behave
Default layout patterns for sections such as galleries or banners
Choosing a theme sets the design framework your site uses.
New themes are added regularly to support different brand styles and layouts.
Changing your site’s colors
To change your site’s colors, use the Colors option in the top bar.
Path: Website Options Bar > Colors
Colors work within the currently selected theme.
Once a theme is selected, you can adjust your brand color using the color slider.
Durable uses a dynamic color system.
As you change your brand color:
Text, buttons, overlays, and backgrounds update automatically
Lightness and contrast are calculated in real time
Nothing becomes hidden or unreadable
You do not need to choose individual colors for every element.
Durable handles visibility and contrast automatically so your site stays accessible and readable.
When you find a color you like, click Done to apply it.
If you do not want to keep the change, click Cancel.
Changing your site’s fonts
Fonts are controlled the same way as colors.
Path: Website Options Bar > Fonts
Choose from the available typography options to update text across your entire site. Font changes apply globally and update in real time.
Click Done to apply the font or Cancel to discard the change.
Designing individual sections
If you want to change how a specific section looks, hover over that section and click Design.
Path: Section Controls > Design
Section design options let you:
Switch between preset layouts
Adjust spacing and alignment where available
Design changes at the section level do not affect other sections or pages.
These changes apply only to the selected section, not the rest of the page.
Some sections also include a Customize option for additional design-related settings.
Navigation and footer design
The navigation bar and footer also include design presets.
When editing either area, switch to the Design tab to choose from available layouts. These presets control structure and positioning, such as alignment, spacing, and whether certain elements are shown.
Navigation and footer design is covered in more detail in a separate article.
Previewing design changes
Design changes update immediately, but it’s always a good idea to preview your site.
Use Preview to see how your site looks without editing controls, and check both desktop and mobile views to ensure the design feels right on different screen sizes.
Saving design changes
Design changes are part of your current editing session.
When you are finished, click Publish Changes to make your updates live.
Path: Website Options Bar > Publish Changes
If you leave the editor without publishing, design changes will not be saved.
Up next
Once your site’s design is in place, the next step is customizing how visitors move through it.
See: Editing Navigation and Footer