Custom job board styling example

Greenhouse Recruiting allows you to upload a custom CSS stylesheet for your hosted or embedded external job board. We allow override-able classes and selectors for most job board elements, like headings, fonts, fields, and buttons.

Sample CSS files

To get you started customizing your careers page, we've provided a few starter CSS files:

• simple_greenhouse_job_board.css: Basic styling meant for modern job boards. This file also contains some basic instructions if you're new to CSS.
• serif_font_job_board.css: Similar styles to simple_greenhouse_job_board.css, except with a different font and additional colors.
• WCAG_2_0_guidelines_job_board.css: A template with simple styles, designed with additional instructions so it's easy to update while staying within accessibility guidelines. 

Download these files using the links above, or the Downloads section on the right side of this article. These files can be uploaded as-is, or updated to fit your organization's standards and branding. Follow the steps below for more information on how to use these files.

Screenshot examples

Simple Greenhouse

Serif font

WCAG 2.0 guidelines

Using these files

Before you begin, make sure your Greenhouse Recruiting job board is well-positioned to work with this new style. There are two things you should check:

• Confirm that candidates apply to jobs at a URL like boards.greenhouse.io/companyname instead of something more custom like yourcompany.com/careers. Our sample CSS style is optimized for Greenhouse-hosted job boards and might look a little strange when embedded into a webpage hosted by your company.
• In Greenhouse Recruiting, navigate to Configure  > Job Board & Posts > Edit Job Board Settings, and upload a logo that includes your company's full name. Our sample CSS style hides the title of the job board for a cleaner visual experience, but it could make it difficult for candidates to know which jobs they're applying to if your logo only includes an icon.

When that's complete, you can download your .css file in the right panel. 

For ease of customization, we've added two colors near the beginning of the file that you can easily edit to fit your brand. If you know the hex code for the colors, you can use a tool like this to convert it to RGB values.

The first value controls the color of the Apply Now and Submit Application buttons on individual job posts.

The second value controls the hover color on the job board.

Once you have your colors saved in the file, simply upload the CSS file within Greenhouse Recruiting and refresh your job board to view the changes.