Sections

Content

Layout

Navigation

Elements

Elements are building blocks that you can use to update or create new page layouts. They’re reusable, can be customized easily using utilities and often used to help compose larger patterns.

Our collection of elements has been developed to reflect the most common page and layout components found in Help Centers. Two examples of elements that feature prominently throughout our themes are:

  1. Buttons

    Buttons are used to represent important actions that a visitor can take on the page.

  2. Badges

    Badges offer a simple way of labeling elements and can be used to highlight important information.

Elements can be added to a page by themselves or as parts of larger patterns. When creating novel layouts and designs, we recommend starting with utilities and creating new elements once repeating combinations start to emerge.

Some elements, like breadcrumbs and pagination, are responsible for styling HTML produced by Zendesk template helpers. Although you can use these elements elsewhere using your own HTML, to customize the appearance of helper output you should use our framework’s Sass variables or custom CSS.

Next steps

  1. Review the available set of elements in this section to learn more about how they can be used and customized.

  2. Consider taking advantage of the provided Sass variables and mixins to make the elements your own and ensure a perfect fit with your company brand.