Logo

Break shows your brand in three places, and each takes it from a different source:

The Site Mark#

The square at the start of the top bar is your publication icon.

1. Go to ⛭ Settings → Design
2. Click Customize
3. On the Brand tab, upload a Publication icon
4. Click Save

Use a square image. It is shown 24 pixels wide, so a simple mark reads better than a detailed one.

Without a publication icon, the square shows the first letter of your site title on your accent color. The letter switches between black and white to stay readable on the accent. See Color Scheme.

The publication icon is also your site's favicon, so one upload covers both.

The Logo#

The logo appears at the top of the menu panel, which opens from the menu button in the rail or the top bar.

1. Go to ⛭ Settings → Design
2. Click Customize
3. On the Brand tab, upload a Publication logo
4. Click Save

The logo is shown up to 28 pixels tall. A horizontal logo works best. SVG keeps it sharp at any size, and a PNG should be at least 600 pixels wide.

Without a logo, the panel shows your site title as text.

Dark Mode Logo#

A dark logo on a dark background disappears. Break handles this in one of two ways.

With a dark mode logo. Upload a second version of your logo for dark backgrounds:

1. Go to ⛭ Settings → Design
2. Click Customize
3. Open the Theme tab
4. Upload an image under Dark mode logo
5. Click Save

The theme shows the regular logo in light mode and this one in dark mode.

Without one. The theme inverts the colors of your regular logo in dark mode, so black becomes white. This works well for a one-color logo. A colored logo changes its colors too, so upload a dark mode logo instead.

The Footer#

The footer shows your site title in large display type, with your site description above it. Both come from ⛭ Settings → General. The footer uses no image, so there is nothing to upload for it.