bricks_get_theme_styles

Phase 1BeginnerRead OnlyComplexity: 2/10

Read theme typography, element defaults, and link styles

Overview

Retrieves the complete theme styles configuration from Bricks Builder. Theme styles control site-wide typography (body text, H1-H6 heading scale), colors, link styles, contextual spacing, and per-element default styles for sections, containers, buttons, and more.

Multiple theme styles can coexist with conditions determining which applies to which pages. Use the optional sections parameter to filter the response and return only specific setting groups such as typography, colors, or element defaults.

This is typically the first tool called in Phase 1 (site context) to understand the existing design system before making changes.

Key Features

Section Filtering

Use the sections parameter to request only specific parts of the theme style (e.g., just typography or just button defaults) to reduce response size.

Multi-Style Support

Returns all theme styles with their display conditions. Multiple styles can coexist — conditions control which applies where based on specificity scoring.

Complete Typography Data

Returns the full typography scale including typographyBody, typographyHeadings (shared), typographyHeadingH1-H6 (per-level), and h1Margin through h6Margin.

Element Defaults

Exposes default settings for 20+ element types: section, container, block, div, button, heading, text, image, form, accordion, tabs, slider, and more.

When to Use

Auditing the existing design system before building pages
Checking current typography scale (H1-H6 font sizes, weights, line-heights)
Verifying heading margins and contextual spacing settings
Reading element defaults for sections, containers, buttons
Inspecting which theme styles exist and their display conditions

Prerequisites

Bricks Builder must be installed and activated
At least one theme style must exist (Bricks creates a "Default" style on activation)

When NOT to Use

When you need to modify theme styles (use bricks_update_theme_styles instead)
When you only need color palette data (use bricks_get_color_palette instead)
When checking global CSS classes (use bricks_get_global_classes instead)

Parameters

2 Total Parameters2 Optional

style_idstringoptional

Specific theme style ID to retrieve. If omitted, returns all theme styles.

sectionsarrayoptional

Only return specific setting sections. Possible values: typography, colors, general, links, contextualSpacing, content, css, popup, conditions, section, container, block, div, button, heading, text, image, form, nav-menu, accordion, alert, carousel, code, counter, divider, icon-box, list, search, sidebar, slider, social-icons, tabs, team-members, testimonials, video.

Values:

typography, colors, general, links, contextualSpacing, content, css, popup, conditions, section, container, block, div, button, heading, text, image, form, nav-menu, accordion, alert, carousel, code, counter, divider, icon-box, list, search, sidebar, slider, social-icons, tabs, team-members, testimonials, video

Code Examples

Get all theme styles

Retrieve every theme style with all settings to understand the current design system.

JSON

{
  // No parameters needed — returns everything
}

Response

{
  "default": {
    "label": "Default",
    "settings": {
      "typography": {
        "typographyBody": { "font-family": "Inter", "font-size": "16px", "line-height": "1.6" },
        "typographyHeadingH1": { "font-size": "52px", "font-weight": "700" },
        "typographyHeadingH2": { "font-size": "40px", "font-weight": "600" }
      },
      "section": { "_padding": { "top": "80", "bottom": "80" } },
      "container": { "_width": "1200px" }
    },
    "conditions": [{ "main": "any" }]
  }
}

Get only typography settings

Filter to just the typography section to check heading scale and margins.

JSON

{
  "style_id": "default",
  "sections": ["typography"]
}

Response

{
  "default": {
    "label": "Default",
    "settings": {
      "typography": {
        "typographyBody": { "font-family": "Inter", "font-size": "16px", "line-height": "1.6", "color": { "hex": "#333333" } },
        "typographyHeadings": { "font-family": "Inter" },
        "typographyHeadingH1": { "font-size": "52px", "font-weight": "700", "line-height": "1.15" },
        "typographyHeadingH2": { "font-size": "40px", "font-weight": "600", "line-height": "1.2" },
        "typographyHeadingH3": { "font-size": "30px", "font-weight": "600", "line-height": "1.3" },
        "h1Margin": { "bottom": "24" },
        "h2Margin": { "top": "48", "bottom": "20" },
        "h3Margin": { "top": "32", "bottom": "16" }
      }
    }
  }
}

Common Mistakes

Warning: Undefined array key "fix_description" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 47

Deprecated: preg_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-includes/kses.php on line 2018

Warning: Undefined array key "wrong_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 48

Warning: Undefined array key "right_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 49

Agents often jump straight into creating pages without reading the existing theme styles, leading to duplicate or conflicting typography settings.

Warning: Undefined array key "fix_description" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 47

Deprecated: preg_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-includes/kses.php on line 2018

Warning: Undefined array key "wrong_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 48

Warning: Undefined array key "right_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 49

Requesting all sections when you only need typography produces a very large response. Use the sections parameter to limit output.

Tips & Warnings

Tip: Always call this tool as part of Phase 1 (site context) before making any design system changes. It reveals the existing typography scale, heading margins, contextual spacing, and element defaults.

Tip: Use sections: ["typography", "links", "contextualSpacing"] to get just the typography-related settings without the full element defaults.

Warning: Multiple theme styles can exist simultaneously. The one with the highest-specificity condition wins for a given page. Always check the conditions array to understand which style applies where.

Return Values

Field	Type	Description
`data`	object	Map of theme style IDs to their configuration objects, each containing label, settings (keyed by section name), and conditions array.
`data[style_id].label`	string	Display name of the theme style (e.g., "Default", "Blog Style").
`data[style_id].settings`	object	Settings object with section keys (typography, colors, links, contextualSpacing, section, container, button, etc.).
`data[style_id].conditions`	array	Array of condition objects that determine where this theme style is active (e.g., entire site, specific post types, specific page IDs).

Related Tools

Technical Details

Tool ID

bricks_get_theme_styles

API Endpoint

/design-system/theme-styles

HTTP Method

GET

Namespace

design-system

Source File

design-system/theme-styles.ts

Version

1.0

Min Bricks Version

1.9

Requires Auth

Yes

Changelog

v1.0

Initial release with section filtering and multi-style support.

20250101