Customising Your Quiz Design

Quizify includes a set of design settings that let you style your quiz to match your Shopify store's branding. You can change fonts, colours, backgrounds, layouts, and more — or add custom CSS for more advanced control.


Where to Find the Design Settings

Design settings are available in two places, depending on your plan:

Per-quiz design settings (Pro plan and above):

  1. Open the Quizify editor for a quiz

  2. Go to the Design tab

  3. Select a category from the left panel to edit those settings

Global design settings (all plans):

  1. Open Quizify from your Shopify admin

  2. Go to SettingsDesign

  3. Edit the settings that apply globally across all quizzes

On the Free and Starter plans, only global design settings are available. Pro plan users can override design settings on a per-quiz basis. Per-quiz settings take precedence over global settings for that quiz.

Design Setting Categories

The Design tab is organised into five categories:

Intro Page

Settings that control the appearance of the quiz intro screen — the first screen customers see before they start answering questions. Includes background, heading styles, and button styling for the intro.

Quiz

Settings that apply to the quiz question and answer screens — fonts, colours, backgrounds, answer card layout, and button styles used throughout the quiz.

Result

Settings for the result page appearance. This category covers design settings for all three result page types:

  • Normal result — The standard product recommendation result page

  • Score result — The result page shown when the quiz uses score-based scoring

  • Type recommendation result — The result page shown when the quiz uses personality or type-based results

Thank You Page

Settings that control the appearance of the thank you screen shown after a customer completes a form or finishes the quiz flow.

Custom CSS

A free-form CSS editor for advanced styling beyond the built-in design settings. Available on the Growth plan and above only. Not available on Free or Starter plans.

What Can Be Customised

Fonts

Change the font family used throughout your quiz — for questions, answers, descriptions, and buttons.

Colours and Backgrounds

Set background colours or upload a background image for the quiz.

Button Styles

Customise the appearance of quiz buttons — background colour, text colour, border, and border radius.

Layout

Control how questions and answer options are displayed — list or grid layout, column count, and image alignment.

Custom CSS

Add custom CSS rules to override or extend Quizify's default styles. Growth plan and above only.