Site Themes Object

{
   "colors":[
      {
         "id":"color_1",
         "value":"rgba(11, 25, 86, 1)",
         "label":"Primary"
      }
   ],
   "text":{
      "default":{
         "font_family":"Poppins",
         "color":"var(--color_1)",
         "font_weight":"400",
         "font_style":null,
         "text_decoration":null,
         "text_direction":null,
         "line_height":"1.5",
         "letter_spacing":null,
         "font_size":"18px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"16px"
            },
            "tablet":{
               "font_size":"16px"
            }
         }
      },
      "paragraph":{
         "font_family":"\"Work Sans\"",
         "color":"rgb(11,25,86)",
         "font_weight":"500",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":"1.5",
         "letter_spacing":"initial",
         "font_size":"18px",
         "text_transform":"uppercase",
         "breakpoints":{
            "mobile":{
               "font_size":"16px"
            },
            "tablet":{
               "font_size":"16px"
            }
         }
      },
      "h1":{
         "font_family":"'Aboreto'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"50px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"40px"
            },
            "tablet":{
               "font_size":"50px"
            }
         }
      },
      "h2":{
         "font_family":"'Aboreto'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"32px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"30px"
            },
            "tablet":{
               "font_size":"30px"
            }
         }
      },
      "h3":{
         "font_family":"'Aboreto'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"25px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"20px"
            },
            "tablet":{
               "font_size":"25px"
            }
         }
      },
      "h4":{
         "font_family":"'Aboreto'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"20px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"18px"
            },
            "tablet":{
               "font_size":"20px"
            }
         }
      },
      "h5":{
         "font_family":"'Work Sans'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"15px",
         "text_transform":null,
         "breakpoints":{
            "mobile":{
               "font_size":"15px"
            },
            "tablet":{
               "font_size":"15px"
            }
         }
      },
      "h6":{
         "font_family":"'Work Sans'",
         "color":"var(--color_1)",
         "font_weight":"700",
         "font_style":"normal",
         "text_decoration":"none",
         "text_direction":null,
         "line_height":null,
         "letter_spacing":null,
         "font_size":"14px",
         "text_transform":null,
         "breakpoints":{
            "mobile":null,
            "tablet":{
               "font_size":"14px"
            }
         }
      }
   },
   "buttons":{
      "primary":{
         "box_shadow":"rgba(0, 0, 0, 0.25) 0px 3px 11px 0px",
         "background":{
            "color":"rgba(37, 99, 235, 1)",
            "gradient":"linear-gradient(90deg, rgba(37, 99, 235, 1), rgba(59, 130, 246, 1))"
         },
         "border":{
            "color":"rgba(37, 99, 235, 1)",
            "width":"2px",
            "radius":"8px"
         },
         "icon":{
            "color":"rgba(255, 255, 255, 1)"
         },
         "hover":{
            "background":{
               "color":"rgba(29, 78, 216, 1)"
            },
            "border":{
               "color":"rgba(29, 78, 216, 1)"
            },
            "text":{
               "color":"rgba(255, 255, 255, 1)",
               "font_weight":"700",
               "text_decoration":"none",
               "font_style":"normal"
            }
         },
         "text":{
            "color":"rgba(255, 255, 255, 1)",
            "font_size":"16px",
            "font_weight":"600",
            "text_decoration":"none",
            "font_style":"normal",
            "font_family":"Arial",
            "text_align":"center",
            "direction":"ltr"
         },
         "breakpoints":{
            "mobile":{
               "text":{
                  "font_size":"14px"
               }
            },
            "tablet":{
               "text":{
                  "font_size":"15px"
               }
            }
         }
      },
      "secondary":{
         "box_shadow":"none",
         "background":{
            "color":"rgba(255, 255, 255, 1)"
         },
         "border":{
            "color":"rgba(37, 99, 235, 1)",
            "width":"2px",
            "radius":"8px"
         },
         "icon":{
            "color":"rgba(37, 99, 235, 1)"
         },
         "hover":{
            "background":{
               "color":"rgba(243, 244, 246, 1)"
            },
            "border":{
               "color":"rgba(29, 78, 216, 1)"
            },
            "text":{
               "color":"rgba(29, 78, 216, 1)",
               "font_weight":"600",
               "text_decoration":"underline",
               "font_style":"italic"
            }
         },
         "text":{
            "color":"rgba(37, 99, 235, 1)",
            "font_size":"16px",
            "font_weight":"500",
            "text_decoration":"none",
            "font_style":"normal",
            "font_family":"'Open Sans'",
            "text_align":"center",
            "direction":"ltr"
         },
         "breakpoints":{
            "mobile":{
               "text":{
                  "font_size":"14px"
               }
            },
            "tablet":{
               "text":{
                  "font_size":"15px"
               }
            }
         }
      }
   },
   "sections":{
      "spacings":{
         "padding_top":"10px",
         "padding_bottom":"10px",
         "padding_left":"20px",
         "padding_right":"20px"
      },
      "content_width":{
         "default_max_width_constraint":"1000px",
         "default_content_mode":"constrained_width"
      },
      "breakpoints":{
         "mobile":{
            "spacing":{
               "padding_top":"5px"
            }
         },
         "tablet":{
            "spacing":{
               "padding_top":"8px"
            }
         }
      }
   },
   "columns":{
      "spacings":{
         "padding_top":"10px",
         "padding_bottom":"10px",
         "padding_left":"20px",
         "padding_right":"20px"
      },
      "breakpoints":{
         "mobile":{
            "spacing":{
               "padding_top":"5px"
            }
         }
      }
   },
   "inner_columns":{
      "spacings":{
         "padding_top":"10px",
         "padding_bottom":"10px",
         "padding_left":"20px",
         "padding_right":"20px"
      },
      "breakpoints":{
         "mobile":{
            "spacing":{
               "padding_top":"5px"
            }
         }
      }
   },
   "background":{
      "color":"#ffffff",
      "image":{
         "url":"https://example.com/background.jpg",
         "display_mode":"COVER",
         "position":"center center",
         "attachment":"scroll"
      },
      "breakpoints":{
         "mobile":{
            "color":"#f0f0f0",
            "image":{
               "url":"https://example.com/mobile-background.jpg",
               "display_mode":"COVER",
               "position":"top center",
               "attachment":"scroll"
            }
         }
      }
   }
}

Colors Object

Data	Type	Description
id	string	Needs to follow the pattern: "color_<number>". (color_1, color_2, etc). This property cannot be changed.
value	string	RGB/RGBA/HEX color value. This will be converted to RGBA by Duda.
label	string	50 chars max. HTML-safe string

Text Object

Data	Type	Description
h1	object	Name of text style
h2	object
h3	object
h4	object
h5	object
h6	object
paragraph	object
default	object	Default text style for site

Text Styles Object

Data	Type	Description
color	string	Color of the font.
font_family	string	Does not accept fallback fonts.
font_size	string	Only accepts px.
font_weight	string	The thickness of the characters in the font.
letter_spacing	string	Horizontal spacing behavior between characters
line_height	string	Vertical spacing between lines of text.
text_decoration	string	Supports: `underline`
font_style	string	Supports: `italic`
text_direction	string	Orientation of the text characters in a line.
text_transform	string	Supports: `uppercase`
breakpoints	object	See breakpoints definition here.

Breakpoints Object

Specify the font size for different device types. Breakpoint overrides will only accept font_size and may only be set for mobile and tablet.

Data	Type	Description
mobile	object	Takes in an object with `font_size` value.
tablet	object	Takes in an object with `font_size` value.

Buttons Object

Data	Type	Description
box_shadow	string	GRBA color + 4 px length values (offset-x, offset-y, blur-radius, spread-radius) + optional inset. Color MUST be at the beginning
background	object	Button background theme settings
border	object	Button border theme settings
icon	object	Button icon theme settings
hover	object	Button hover theme settings
text	object	Button text theme settings
breakpoints	object	Button breakpoints theme settings

Buttons Background Object

Data	Type	Description
color	string	RGBA color or CSS variable
gradient	string	Gradient value only. Cannot be combined with image.
image	object	Background image configuration. Cannot be combined with gradient.

Background Image Object

Data	Type	Description
url	string	URL of the background image
display_mode	string	Display mode: "cover", "contain", "tile", "no_repeat"
position	string	Allowed values: "top left", "top center", "top right", "center left", "center center", "center right", "bottom left", "bottom center", "bottom right"

Buttons Border Object

Data	Type	Description
color	string	RGBA color or CSS variable, 1-4 space-separated values
width	string	Pixel values: 1-4 space-separated values
radius	string	Border radius: 1-4 pixel values

Buttons Icon Object

Data	Type	Description
color	string	RGBA color or CSS variable (used for both color and fill)

Buttons Hover Object

Data	Type	Description
background	object	Hover background styles
border	object	Hover border styles
text	object	Hover text styles

Hover Background Object

Data	Type	Description
color	string	RGBA color or CSS variable

Hover Border Object

Data	Type	Description
color	string	RGBA color or CSS variable

Hover Text Object

Data	Type	Description
color	string	RGBA color or CSS variable
font_weight	string	Numeric strings or keywords: "100", "200", "300", "400", "500", "600", "700", "800", "900", "bold", "normal"
text_decoration	string	"underline" or "none" only
font_style	string	"normal" or "italic" only

Buttons Text Object

Data	Type	Description
color	string	RGBA color or CSS variable
font_size	string	Pixel values only
font_weight	string	Numeric strings or keywords: "100", "200", "300", "400", "500", "600", "700", "800", "900", "bold", "normal"
text_decoration	string	"underline" or "none" only
font_style	string	"normal" or "italic" only
font_family	string	Single font name only - no fallbacks supported
text_align	string	"left", "center", or "right" only
direction	string	"ltr" or "rtl" only

Buttons Breakpoints Object

Data	Type	Description
mobile	object	Buttons breakpoint style object
tablet	object

Buttons Breakpoints Style Object

Data	Type	Description
text	object	Buttons breakpoint text style object

Breakpoints Text Style Object

Data	Type	Description
font_size	string	Pixel values only

Sections Object

Data	Type	Description
spacings	object	Sections spacing object
content_width	object	Sections content width object
breakpoints	object	Sections breakpoint object

Sections Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Sections Content Width Object

Data	Type	Description
default_max_width_constraint	string	Combined value and unit. Supports PX (960-1920) and VW (50-100). Examples: "1000px", "60vw"
default_content_mode	string	Content mode: "constrained_width" or "full_width"

Sections Breakpoint Object

Data	Type	Description
mobile	object	Sections breakpoint style object
tablet	object

Sections Breakpoint Style Object

Data	Type	Description
spacing	object	Sections breakpoint style spacing object

Sections Breakpoint Style Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Columns Object

Data	Type	Description
spacing	object	Columns spacing object
breakpoints	object	Columns breakpoint object

Columns Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Columns Breakpoint Object

Data	Type	Description
mobile	object	Column breakpoint style object
tablet	object

Columns Breakpoint Style Object

Data	Type	Description
spacing	object	Columns breakpoint style spacing object

Columns Breakpoint Style Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Inner Columns Object

Data	Type	Description
spacings	object	Inner column spacing object
breakpoints	object	Inner column breakpoint object

Inner Columns Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Inner Columns Breakpoint Object

Data	Type	Description
mobile	object	Inner column breakpoint style object
tablet	object

Inner Columns Breakpoint Style Object

Data	Type	Description
spacing	object	Inner column breakpoing style spacing object

Inner Columns Breakpoint Style Spacing Object

Data	Type	Description
padding_top	string	Padding values: supports px, %, vw, vh (e.g. "10px", "5%", "10vw")
padding_bottom	string
padding_left	string
padding_right	string

Background Object

Data	Type	Description
color	string	CSS color value (e.g. "#ffffff", "rgb(255,255,255)")
gradient	string	CSS gradient value. Note: image and gradient are mutually exclusive - only one can be provided at each level.
image	object	Background image object. Note: image and gradient are mutually exclusive - only one can be provided at each level.
breakpoints	object	Background breakpoint object

Background Image object

Data	Type	Description
url	string	Image URL
display_mode	string	Can be: 'COVER' \| 'CONTAIN' \| 'TILE' \| 'NO_REPEAT';
position	string	Can be: 'top left' \| 'top center' \| 'top right' \| 'center left' \| 'center center' \| 'center right' \| 'bottom left' \| 'bottom center' \| 'bottom right';
attachment	string	Can be: 'fixed' \| 'scroll';

Background Breakpoint Object

Data	Type	Description
mobile	object	Background breakpoint style object

Background Breakpoint Style Object

Data	Type	Description
color	string	CSS color value
gradient	string	CSS gradient value. Note: image and gradient are mutually exclusive - only one can be provided at each level.
image	object	Background breakpoint style image object. Note: image and gradient are mutually exclusive - only one can be provided at each level.