design.json: visual defaults

This file supplies design configuration to the presentation. Keep it separate from the owner’s words and pictures: definition.json describes content, while design.json supplies supported visual settings.

A small, valid theme example is:

design.json

{
  "theme": {
    "presetId": "minimal",
    "overrides": {}
  }
}

Theme settings

theme.presetId selects an existing theme preset; minimal is the example here. theme.overrides contains supported token overrides. It is not an arbitrary CSS object. Start with the initialized project’s design file and use keys and values supported by the installed theme contract.

An empty object {} is also accepted and is normalized with platform design defaults. The design schema includes platform page/layout settings; not every key is a new editable field in the owner’s content editor.

What this file does not do

Changing a value does not automatically restyle all custom markup. Your presentation components and styles must use the SDK/theme values they rely on. Keep custom CSS in the presentation’s authored files; do not invent css, javascript or layout-builder keys in this JSON.

The SDK supplies design to components. A data.json request with source: "design" can also expose it under a chosen data key.

If you want the owner to edit a heading, use a content field. If you want to organize that heading’s input into a dashboard section, use editor.json. That dashboard arrangement is independent of the public page’s visual design.

After editing design defaults, run validation and inspect both the actual rendered page and its responsive behavior.