Skip to content
ZenTheme Lab

ZenTheme Nightfall

A free Zendesk Help Center theme in the Graphite look, with dark mode that follows your visitor's system. Templating API v4.

The demo is Tarepoint, a fictional company.

What it is.

Graphite look

The same clean, quiet layout as ZenTheme Pro's Graphite look.

Dark mode that follows the system

Visitors get light or dark from their device setting. There is no toggle in the free theme.

Midnight blue, your colour carried in

Dark mode is a calm midnight blue, not flat black. Your brand colour is lifted automatically so buttons and links stay readable.

⌘K search

Open search from anywhere in the Help Center with ⌘K or Ctrl K.

Article table of contents

Long articles get a contents list built from their headings.

Axe-checked

Checked with axe-core for accessibility issues. It is not a guarantee for your own content.

Install.

Nightfall is coming to the Zendesk Marketplace, free.

  1. Open the Nightfall listing on the Zendesk Marketplace and choose Get.
  2. Pick the Help Center to install it on.
  3. In Guide, open Customize design and find Nightfall in your themes.
  4. Set your brand colour and logo, then Publish.

Want it before the listing is live? Email hello@zenthemelab.com and we send you the theme zip to import under Customize design, Add theme, Import.

All 47 settings.

Version 1.1.1. Everything below is in Guide, under Customize design.

Colors

SettingWhat it doesTypeDefault
Brand colorBrand color for major navigational elementscolor#17494D
Brand text colorBrand color for hover and active statescolor#FFFFFF

Brand

SettingWhat it doesTypeDefault
LogoCompany logofileEmpty
Use a separate logo in dark modeShow the dark mode logo below when dark mode is activecheckboxOff
Dark mode logoLogo shown in the header in dark mode. Use a light-colored version of your logofileEmpty
Logo heightHeight of the logo in the header, in pixelsrange37 (20 to 80)
Logo height (mobile)Height of the logo in the header on mobile screens, in pixelsrange28 (16 to 60)
Show Help Center nameDisplay the Help Center name next to the logocheckboxOn
FaviconIcon displayed in the address bar of your browserfileEmpty

Announcement bar

SettingWhat it doesTypeDefault
Announcement textShown in a slim bar above the header. Leave blank to hide the bartextEmpty
Announcement linkOptional URL the announcement links totextEmpty

Footer

SettingWhat it doesTypeDefault
Footer textShort line or tagline shown in the footertextEmpty
Footer link 1 labelText of the link. Leave blank to hide ittextEmpty
Footer link 1 URLWhere the link goes, e.g. https://example.com/statustextEmpty
Footer link 2 labelText of the link. Leave blank to hide ittextEmpty
Footer link 2 URLWhere the link goes, e.g. https://example.com/statustextEmpty
Footer link 3 labelText of the link. Leave blank to hide ittextEmpty
Footer link 3 URLWhere the link goes, e.g. https://example.com/statustextEmpty
Footer link 4 labelText of the link. Leave blank to hide ittextEmpty
Footer link 4 URLWhere the link goes, e.g. https://example.com/statustextEmpty

Images

SettingWhat it doesTypeDefault
Service catalog hero imageHero image on the service catalog pagefileEmpty

Search settings

SettingWhat it doesTypeDefault
Instant searchShow suggested articles on searchcheckboxOn
Scoped search in help centerSearch results are confined to the category the user is incheckboxOn
Scoped search in CommunitySearch results are confined to the topic the user is incheckboxOn

Home page hero

SettingWhat it doesTypeDefault
Hero titleMain heading shown above the search boxtextHow can we help?
Hero subtitleShort text below the heading. Leave empty to hide ittextSearch our help center or browse topics below.
Show help center name above the titleDisplay the help center name as a small label above the hero titlecheckboxOn

Community block

SettingWhat it doesTypeDefault
Community block titleHeading of the home page community blocktextCommunity
Community block textOne line under the community titletextSwap tips, ask questions and share what you've built.
Community hero titleHeading of the community pages hero. Empty uses CommunitytextEmpty
Community hero textOne line under the community hero titletextAsk questions, share ideas and learn from other customers.

Home page elements

SettingWhat it doesTypeDefault
Recent activityShow recent activity on home pagecheckboxOn

Article page elements

SettingWhat it doesTypeDefault
Articles in sectionShow sidebar of articles in sectioncheckboxOn
AuthorShow author image and namecheckboxOn
CommentsShow comments on articlescheckboxOn
FollowUsers can follow a specific articlecheckboxOn
Recently viewedShow recently viewed articlescheckboxOn
Related articlesShow related articlescheckboxOn
Social sharingShow social media sharing on articlecheckboxOn
Table of contentsShow an On this page list built from h2 and h3 headings (needs 3 or more)checkboxOn
Reading timeShow an estimated N min read next to the article datecheckboxOn
Back to top buttonShow a floating button after scrolling downcheckboxOn

Section page elements

SettingWhat it doesTypeDefault
FollowUsers can follow a specific sectioncheckboxOn

Community post elements

SettingWhat it doesTypeDefault
FollowUsers can follow a specific postcheckboxOn
Social sharingShow social media sharing on postcheckboxOn

Community topic elements

SettingWhat it doesTypeDefault
FollowUsers can follow a specific topiccheckboxOn

Show suggested articles

SettingWhat it doesTypeDefault
Show suggested articlesShow suggested articles on new request formcheckboxOn

What Pro adds.

  • A visitor toggle for light and dark
  • Hand-set palettes for each mode
  • Three looks
  • Community layouts
  • The full style system
  • Header layouts
  • Custom fonts
See ZenTheme Pro

Support.

Check this page and the guides below first. If you are still stuck, email hello@zenthemelab.com.

Guides for Help Center owners