Accent color, header image, dark mode and density

Nine settings change how your published manual looks without changing a word of it: the header image, the accent color, light or dark, the spacing, the section list, the section numbers, the footer note, the link to your own site, and the Stylehub credit.

WhereDashboard, Brand manual, Settings, Design, and Settings, Advanced

Where they are

Open a manual and switch from Content to Settings. The settings on this page are in two of the pills across the top:

One Save settings button saves all cards at once, even the ones not on screen. It stays disabled until you change something. You need the manual:write permission, shown in the role editor as Edit sections and content. See Roles. On a wide screen the right-hand column previews your unsaved changes at desktop width.

Header image

Header image (cover background) puts a wide image behind the cover. Upload a file or pick one from your asset library. Use an image about 2000px wide.

• The image fills the hero, with a dark overlay over it. The overlay is 45 percent unless you set another value on the cover block.
• With an image, the hero text is white and ignores your accent color.
• This image replaces any background set on the cover block itself.
• If you delete the file from the library later, the hero is drawn without it. See Where a file is used.
• Hero height, alignment and overlay are on the cover block, not here. Every block, and what it holds.

Accent color

Accent color opens sixteen presets, a color picker and a hex box. It reads Default when nothing is set, and Use the template default clears it. Only a six-digit hex like #rrggbb is saved; anything else snaps back.

What the accent paints

Text on your accent is chosen for you and adjusted until it is readable, so a pale yellow hero gets dark text and a deep navy one gets light text. There is no setting for this.

Light and dark

Color mode is Light or Dark. It is your choice for the page, not the reader's: the published manual ignores the visitor's system setting and there is no switch on the page.

Dark repaints the page background, the cards, the borders, the rules, the hover states and the links. Layout and type do not change. With no accent color, a dark manual uses the template's dark hero; with an accent, the hero stays in your color.

Spacing density

Spacing density is Compact, Default or Spacious. It changes one thing: the space above and below each section. Margins, text width, type sizes and the gaps between blocks stay as the template sets them. Each template has its own three values, so Compact looks different from template to template.

The section list

Show section navigation is on for a new manual. Turning it off removes all of this from the published page:

• The section links in the sticky top bar, up to the first six.
• The All button beside them, followed by the section count, shown when a manual has more than six sections.
• The Search button, the search over the page, and the / shortcut.
• The Sections sheet, which is how the list is reached on a phone.
• The reading progress bar and the Top button that appears once you have scrolled down.

The list holds only sections that have content, never the cover. See What a reader can do on a published page.

Section numbers

Show section numbers (01, 02, ...) is on for a new manual. Numbers are two digits and count the sections that are drawn, so the cover is not number one.

Each template draws the number differently. With numbers off, a container section has no label at all.

Footer note and your website

Both fields are in Advanced and both feed the line at the bottom left of every published page.

An address without https:// gets it added. Only http and https addresses are accepted; anything else is dropped and the footer line stays plain text.

Removing the Stylehub credit

Show "Powered by Stylehub" in the footer is on for a new manual. On, the bottom right of every published page shows a small Made with Stylehub credit linked to stylehub.cloud. Clear the checkbox to remove it.

On a plan without it, the checkbox is dimmed and marked White-label is on Pro and Business, with a link to Billing (opens in a new tab). See What each plan includes.

Where these settings apply

Each manual has one set of design settings, used on the published page, in the print view and the PDF, and in the version, history and settings previews. The print view and the PDF leave out reader controls such as search and the copy link buttons, but keep the image, accent, color mode, density, numbers and footer. All 5 templates support every one of these settings. See The presentation templates.

What is not on this page

• Layout template, in Basics. The presentation templates.
• Heading and body font, in Typography. Fonts, licenses and specimens.
• Favicon, social image, page title and meta description, in SEO. Search engines and the head of a page.
• Brand colors and palettes are content. Changing the accent does not change a swatch you have documented. Color, contrast, tints and shades.

If a change does not show

1. Look at Save settings. Disabled means nothing is unsaved; Saving... means it is still going.
2. Read the message under the form. It explains a refusal in one line.
3. A manual frozen by a downgrade refuses every settings save until it is made active again or the plan covers it. What a downgrade freezes.
4. An accent still on Default after a save was not a six-digit hex.
5. A hero that ignores the accent has a header image over it. Clear the image to see the color.
6. A footer that is not a link had an address that was not http or https.

Every save is recorded with the field, the old value and the new one, under labels such as Accent color, Color mode, Spacing density, Section navigation, Section numbers and Stylehub footer. See History and versions.