Themes

A theme sets the look of a form: its colors, font, spacing, borders, and logo. The Platform API reads themes and applies them to forms. Themes themselves are created and edited in the app, as described in Design & themes.

Operation	What it does
GET /v1/themes	Lists the system themes and the themes of the organization.
GET /v1/themes/{theme_id}	Reads one theme with its design properties.

Both reads need forms:read or templates:read and cost one credit.

Listing themes

curl -s -H "Authorization: Bearer $FOMR_TOKEN" \
  https://platform.fomr.io/v1/themes

The list holds the system themes fomr provides to every organization first, then the themes your organization created, each group oldest first. Deleted themes and the themes of other organizations never appear.

GET /v1/themes

{
  "data": [
    {
      "id": "6d76842f-9ee0-425a-a8c8-b0628f7a9295",
      "name": "Fomr Default",
      "is_system": true,
      "is_new_form_default": true,
      "properties": {
        "background_color": "#ffffff",
        "background_url": null,
        "text_color": "#27272a",
        "secondary_text_color": "#68686a",
        "primary_color": "[\"#e5e5e5\",\"#b7b7b8\",\"#8b8b8d\",\"#616164\",\"#3b3b3e\",\"#18181b\",\"#141417\",\"#100f13\",\"#0a090e\",\"#030308\"]",
        "option_colors": "[\"#6d67af\",\"#8f5a98\",\"#a45471\",\"#a85745\",\"#9a6418\",\"#7a7515\",\"#498143\",\"#008671\",\"#008198\",\"#3a75af\"]",
        "primary_text_color": "#ffffff",
        "border_color": "#939395",
        "shadow_color": "#bebebf",
        "dimmed_color": "#e9e9ea",
        "error_color": "#e7000b",
        "input_background_color": "#ffffff",
        "input_text_color": "#27272a",
        "form_width": "md",
        "form_size": "md",
        "form_spacing": "md",
        "form_align_x": "center",
        "form_align_y": "center",
        "is_form_background_color": 0,
        "is_form_background_blur": 0,
        "border_radius": "small",
        "border_shadow": "small",
        "logo_url": null,
        "logo_align_x": "center",
        "is_logo_hidden": null,
        "logo_width": null,
        "is_logo_full_width": null,
        "page_actions_show_back_button": 0,
        "page_actions_show_button_arrows": 0,
        "page_actions_alignment": "left",
        "select_options_layout": "list",
        "font_id": "Inter"
      }
    },
    {
      "id": "2c6094e3-f066-4627-a211-f5c2edf7e4ab",
      "name": "Fomr Dark",
      "is_system": true,
      "is_new_form_default": false,
      "properties": {
        "background_color": "#27272a",
        "background_url": null,
        "text_color": "#ffffff",
        "secondary_text_color": "#bebebf",
        "primary_color": "[\"#f0f2ff\",\"#d4dafe\",\"#b6c3fc\",\"#96acfa\",\"#7097f8\",\"#3b82f6\",\"#3065d2\",\"#2449af\",\"#152f8d\",\"#00156c\"]",
        "option_colors": "[\"#4484ec\",\"#926de0\",\"#bf5ab4\",\"#d85174\",\"#d75c1b\",\"#bb7700\",\"#849200\",\"#00a34f\",\"#00a59a\",\"#0099d2\"]",
        "primary_text_color": "#ffffff",
        "border_color": "#939395",
        "shadow_color": "#68686a",
        "dimmed_color": "#3d3d3f",
        "error_color": "#e7000b",
        "input_background_color": "#38383b",
        "input_text_color": "#ffffff",
        "form_width": "md",
        "form_size": "md",
        "form_spacing": "md",
        "form_align_x": "center",
        "form_align_y": "center",
        "is_form_background_color": 0,
        "is_form_background_blur": 0,
        "border_radius": "none",
        "border_shadow": "none",
        "logo_url": null,
        "logo_align_x": "center",
        "is_logo_hidden": null,
        "logo_width": null,
        "is_logo_full_width": null,
        "page_actions_show_back_button": 0,
        "page_actions_show_button_arrows": 0,
        "page_actions_alignment": "left",
        "select_options_layout": "list",
        "font_id": "Inter"
      }
    },
    {
      "id": "3f1c9a52-7d4e-4b8a-9c61-2e5f8d0a7b14",
      "name": "Acme brand",
      "is_system": false,
      "is_new_form_default": false,
      "properties": {
        "background_color": "#ffffff",
        "background_url": null,
        "text_color": "#1f2937",
        "secondary_text_color": "#68686a",
        "primary_color": "[\"#e5e5e5\",\"#b7b7b8\",\"#8b8b8d\",\"#616164\",\"#3b3b3e\",\"#18181b\",\"#141417\",\"#100f13\",\"#0a090e\",\"#030308\"]",
        "option_colors": "[\"#6d67af\",\"#8f5a98\",\"#a45471\",\"#a85745\",\"#9a6418\",\"#7a7515\",\"#498143\",\"#008671\",\"#008198\",\"#3a75af\"]",
        "primary_text_color": "#ffffff",
        "border_color": "#939395",
        "shadow_color": "#bebebf",
        "dimmed_color": "#e9e9ea",
        "error_color": "#e7000b",
        "input_background_color": "#ffffff",
        "input_text_color": "#27272a",
        "form_width": "md",
        "form_size": "md",
        "form_spacing": "md",
        "form_align_x": "center",
        "form_align_y": "center",
        "is_form_background_color": 0,
        "is_form_background_blur": 0,
        "border_radius": "small",
        "border_shadow": "small",
        "logo_url": null,
        "logo_align_x": "center",
        "is_logo_hidden": null,
        "logo_width": null,
        "is_logo_full_width": null,
        "page_actions_show_back_button": 0,
        "page_actions_show_button_arrows": 0,
        "page_actions_alignment": "left",
        "select_options_layout": "list",
        "font_id": "Lato"
      }
    }
  ]
}

Every field of a theme is listed in the response of Read a theme.

• is_system is true for a theme of the fomr catalog, which every organization can use, and false for a theme your organization owns.
• is_new_form_default marks the one theme a new form receives. It is also the theme null in styles.theme_id applies.
• properties uses the same fields as a form’s theme override. The palettes, primary_color and option_colors, are JSON-encoded strings.

Reading one theme

GET /v1/themes/{theme_id} reads the theme whose ID a form carries in styles.theme_id. A theme that does not exist, was deleted, or belongs to another organization answers 404 NOT_FOUND.

Applying a theme to a form

Send the theme ID as styles.theme_id when you create a form or replace its draft:

{
  "styles": { "theme_id": "6d76842f-9ee0-425a-a8c8-b0628f7a9295" }
}

• On create, a form sent without styles.theme_id gets the default theme.
• On a draft write, leaving styles.theme_id out keeps the current theme, and null applies the default theme.
• An unknown ID is 400 INVALID_INPUT at styles/theme_id. Only system themes and themes of your organization can be applied.
• Changing the theme clears the form’s color, font, border, and option layout overrides, as choosing a theme in the app does. Background, layout, logo, and page button overrides are kept.
• The theme is part of the draft. A change marks the form as having unpublished changes and reaches respondents on the next publish.

styles.theme_name and styles.override_properties stay read-only. Override properties are edited in the app.