Echo Theme Options Catalogue

All 161 options declared in resources/themes/echo/theme.json, in the order they appear on Appearance → Theme options. Read any of them with theme_option('key').

Reading this table

Default is the value used until the site saves one; spacing defaults are listed as top, right, bottom, left. Switch options store the strings yes and no. Choices list the stored values, not the labels. How these options are stored and compiled into CSS is explained in Theme options and CSS pipeline. The core adds a few fields to these tabs that are not in theme.json (menu pickers, footer widget settings) and an Advanced tab with the reset and Regenerate Theme CSS buttons.

Light colours (26)

Key	Type	Default	Label and notes
`primary_color`	color	`#345D32`	Primary color
`secondary_color`	color	`#9CAC55`	Secondary color
`success_color`	color	`#97CE97`	Success color
`info_color`	color	`#A6F2DE`	Info color
`warning_color`	color	`#C69045`	Warning color
`danger_color`	color	`#AD5252`	Danger color
`light_color`	color	`#F7F9F4`	Light color
`body_background_color`	color	`#FFFFFF`	Body background
`surface_color`	color	`#FFFFFF`	Surface color
`surface_alt_color`	color	`#F7F9F4`	Alternate surface
`body_color`	color	`#667264`	Body text color
`body_emphasis_color`	color	`#202A23`	Emphasis text color
`body_secondary_color`	color	`rgba(102, 114, 100, 0.75)`	Secondary text color
`body_secondary_background_color`	color	`#E9EEE5`	Secondary background
`body_tertiary_color`	color	`rgba(102, 114, 100, 0.5)`	Tertiary text color
`body_tertiary_background_color`	color	`#F7F9F4`	Tertiary background
`muted_color`	color	`rgba(102, 114, 100, 0.75)`	Muted text color
`gray_400_color`	color	`#BEC9B9`	Gray 400
`gray_500_color`	color	`#8D9C88`	Gray 500
`gray_700_color`	color	`#4A5549`	Gray 700
`gray_800_color`	color	`#313C33`	Gray 800
`heading_color`	color	`#202A23`	Heading color
`link_color`	color	`#345D32`	Link color
`link_hover_color`	color	`#182B17`	Link hover color
`border_color`	color	`#E9EEE5`	Border color
`focus_color`	color	`rgba(52, 93, 50, 0.22)`	Focus and control shadow color

Dark colours (16)

Key	Type	Default	Label and notes
`dark_color`	color	`#202A23`	Dark color
`dark_body_background_color`	color	`#141C16`	Dark mode body background
`dark_surface_color`	color	`#1B261E`	Dark mode surface
`dark_body_color`	color	`#CED8CA`	Dark mode body text
`dark_heading_color`	color	`#F7F9F4`	Dark mode heading text
`dark_border_color`	color	`rgba(217, 225, 213, 0.14)`	Dark mode border
`dark_light_color`	color	`#263429`	Dark mode light surface
`dark_gray_100_color`	color	`#223027`	Dark mode gray 100
`dark_gray_200_color`	color	`#2C3A30`	Dark mode gray 200
`dark_gray_300_color`	color	`#435247`	Dark mode gray 300
`dark_gray_400_color`	color	`#748276`	Dark mode gray 400
`dark_gray_500_color`	color	`#9DA99D`	Dark mode gray 500
`dark_gray_600_color`	color	`#B7C1B5`	Dark mode gray 600
`dark_gray_700_color`	color	`#CCD4CA`	Dark mode gray 700
`dark_gray_800_color`	color	`#E3E8E1`	Dark mode gray 800
`dark_gray_900_color`	color	`#F7F9F4`	Dark mode gray 900

Typography (15)

Key	Type	Default	Label and notes
`body_font_family`	font	`Inter`	Body font family
`heading_font_family`	font	`Manrope`	Heading font family
`body_font_variant`	text	`400,500,600,700`	Body font weights
`heading_font_variant`	text	`500,600,700`	Heading font weights
`body_font_size`	text	`1rem`	Body font size
`body_line_height`	text	`1.55`	Body line height
`body_letter_spacing`	text	`0`	Body letter spacing
`heading_line_height`	text	`1.2`	Heading line height
`heading_letter_spacing`	text	`-.015em`	Heading letter spacing
`h1_font_size`	text	`2.5rem`	H1 font size
`h2_font_size`	text	`2rem`	H2 font size
`h3_font_size`	text	`1.625rem`	H3 font size
`h4_font_size`	text	`1.375rem`	H4 font size
`h5_font_size`	text	`1.125rem`	H5 font size
`h6_font_size`	text	`1rem`	H6 font size

Layout (6)

Key	Type	Default	Label and notes
`container_max_width`	text	`1320px`	Container maximum width
`content_max_width`	text	`48rem`	Content maximum width
`section_padding`	spacing	`2.5rem 0 2.5rem 0`	Section padding
`section_padding_mobile`	spacing	`1.75rem 0 1.75rem 0`	Section padding (mobile)
`grid_gutter`	text	`1.75rem`	Grid gutter
`show_title`	switch	`yes`	Show page title

Components (10)

Key	Type	Default	Label and notes
`button_padding`	spacing	`.625rem 1.125rem .625rem 1.125rem`	Button padding
`form_control_height`	text	`2.75rem`	Form control minimum height
`card_padding`	spacing	`1.25rem 1.25rem 1.25rem 1.25rem`	Card padding
`border_width`	text	`1px`	Border width
`border_radius`	text	`.5rem`	Border radius
`button_radius`	text	`.5rem`	Button radius
`card_radius`	text	`.875rem`	Card radius
`box_shadow`	text	`0 .25rem .75rem rgba(32, 42, 35, .08)`	Default shadow
`card_shadow`	text	`0 .125rem .375rem rgba(32, 42, 35, .08)`	Card shadow
`border_style`	select	`solid`	Border style `soliddasheddottednone`

Header (23)

Key	Type	Default	Label and notes
`header_preset`	image-select	`logo-left`	Header layout preset `logo-leftcenteredsplitpillfullscreencommercecontacttagindex`
`logo_height`	number	`35`	Logo height
`header_background_color`	color	`#FFFFFF`	Header background
`header_text_color`	color	`#667264`	Header text color
`header_link_hover_color`	color	`#345D32`	Header link hover
`dropdown_background_color`	color	`#FFFFFF`	Dropdown background (custom menu colors) Shown when menu_color_mode = custom
`mega_menu_background_color`	color	`#FFFFFF`	Mega menu background (custom menu colors) Shown when menu_color_mode = custom
`mobile_menu_background_color`	color	`#FFFFFF`	Mobile menu background (custom menu colors) Shown when menu_color_mode = custom
`menu_color_mode`	select	`header`	Menu colors `headercustom`
`header_cta_label`	text	empty	Header button text
`header_cta_url`	text	empty	Header button link
`header_account`	select	`show`	Account button `showhide`
`header_contact_icon`	select	`phone-call`	Contact card icon `phone-callenvelope-simplewhatsapp-logomap-pinclock` Shown when header_preset = contact
`header_contact_label`	text	empty	Contact card label Shown when header_preset = contact
`header_contact_value`	text	empty	Contact card details Shown when header_preset = contact
`header_contact_link`	text	empty	Contact card link Shown when header_preset = contact
`sticky_header`	switch	`no`	Sticky header
`header_shadow`	switch	`yes`	Header shadow
`dark_header`	switch	`no`	Dark header
`nav_hover_open`	switch	`yes`	Open desktop submenus on hover
`header_width`	select	`no`	Full width header `noyes`
`enable_search_in_header`	switch	`no`	Show search in header Shown when header_preset = centered
`header_style`	select	`flat`	Header shape `flatrounded`

Top bar (13)

Key	Type	Default	Label and notes
`topbar_enabled`	switch	`no`	Show top bar
`topbar_mobile`	switch	`no`	Show top bar on mobile Shown when topbar_enabled = true
`topbar_start_type`	radio	`text`	Left side content `textmenu` Shown when topbar_enabled = true
`topbar_start_text`	textarea	empty	Left side text Shown when topbar_enabled = true and topbar_start_type = text
`topbar_end_type`	radio	`text`	Right side content `textmenu` Shown when topbar_enabled = true
`topbar_end_text`	textarea	empty	Right side text Shown when topbar_enabled = true and topbar_end_type = text
`topbar_background_color`	color	`#202A23`	Top bar background Shown when topbar_enabled = true
`topbar_text_color`	color	`#CED8CA`	Top bar text color Shown when topbar_enabled = true
`topbar_link_color`	color	`#FFFFFF`	Top bar link color Shown when topbar_enabled = true
`topbar_link_hover_color`	color	`#A6F2DE`	Top bar link hover Shown when topbar_enabled = true
`topbar_menu_color`	color	`#E3E8E1`	Top bar menu color Shown when topbar_enabled = true
`topbar_menu_hover_color`	color	`#A6F2DE`	Top bar menu hover Shown when topbar_enabled = true
`topbar_border_color`	color	`#2C3A30`	Top bar border Shown when topbar_enabled = true

Key	Type	Default	Label and notes
`mega_menu_width_mode`	select	`container`	Mega menu width `contentcontainerfullcustom`
`mega_menu_custom_width`	text	`960px`	Mega menu custom width
`mega_menu_columns`	number	`4`	Default mega menu columns
`submenu_open_delay`	number	`120`	Submenu open delay (ms)
`submenu_close_delay`	number	`220`	Submenu close delay (ms)

Breadcrumbs (27)

Key	Type	Default	Label and notes
`show_breadcrumbs`	switch	`yes`	Show breadcrumbs
`show_breadcrumbs_mobile`	switch	`yes`	Show on mobile Shown when show_breadcrumbs = yes
`breadcrumbs_show_title`	switch	`yes`	Show page title Shown when show_breadcrumbs = yes
`breadcrumbs_width`	select	`yes`	Container width `yesno` Shown when show_breadcrumbs = yes
`breadcrumbs_alignment`	select	`start`	Alignment `startcenterend` Shown when show_breadcrumbs = yes
`breadcrumbs_height`	select	`auto`	Height `auto4rem5rem6rem8rem` Shown when show_breadcrumbs = yes
`breadcrumbs_min_height`	select	`4rem`	Minimum height `03rem4rem5rem6rem` Shown when show_breadcrumbs = yes
`breadcrumbs_padding`	spacing	`.5rem 0 .5rem 0`	Breadcrumb padding Shown when show_breadcrumbs = yes
`breadcrumbs_margin`	spacing	`0 0 1rem 0`	Breadcrumb margin Shown when show_breadcrumbs = yes
`breadcrumbs_font_size`	select	`.875rem`	Font size `.75rem.875rem1rem1.125rem` Shown when show_breadcrumbs = yes
`breadcrumbs_separator`	select	`›`	Separator `›→/•` Shown when show_breadcrumbs = yes
`breadcrumbs_separator_size`	select	`.875rem`	Separator size `.75rem.875rem1rem1.125rem` Shown when show_breadcrumbs = yes
`breadcrumbs_separator_spacing`	select	`.5rem`	Separator spacing `.25rem.5rem.75rem1rem` Shown when show_breadcrumbs = yes
`breadcrumbs_background_color`	color	`transparent`	Background color Shown when show_breadcrumbs = yes
`breadcrumbs_background_image`	file	empty	Background image Shown when show_breadcrumbs = yes
`breadcrumbs_background_position`	select	`center`	Background position `centercenter topcenter bottomleft centerright center` Shown when show_breadcrumbs = yes
`breadcrumbs_background_size`	select	`cover`	Background size `covercontainauto100% autoauto 100%` Shown when show_breadcrumbs = yes
`breadcrumbs_background_repeat`	select	`no-repeat`	Background repeat `no-repeatrepeatrepeat-xrepeat-y` Shown when show_breadcrumbs = yes
`breadcrumbs_overlay_color`	color	`#000000`	Overlay color Shown when show_breadcrumbs = yes
`breadcrumbs_overlay_opacity`	range	`0`	Overlay opacity Shown when show_breadcrumbs = yes
`breadcrumbs_text_color`	color	`rgba(102, 114, 100, 0.75)`	Text color Shown when show_breadcrumbs = yes
`breadcrumbs_link_color`	color	`#345D32`	Link color Shown when show_breadcrumbs = yes
`breadcrumbs_hover_color`	color	`#182B17`	Hover color Shown when show_breadcrumbs = yes
`breadcrumbs_active_color`	color	`rgba(102, 114, 100, 0.75)`	Active item color Shown when show_breadcrumbs = yes
`breadcrumbs_border`	select	`0`	Border `0var(--bs-border-width) solid var(--bs-border-color)var(--bs-border-width) solid var(--bs-primary)` Shown when show_breadcrumbs = yes
`breadcrumbs_border_radius`	select	`0`	Border radius `0var(--bs-border-radius-sm)var(--bs-border-radius)var(--bs-border-radius-lg)var(--bs-border-radius-xl)` Shown when show_breadcrumbs = yes
`breadcrumbs_box_shadow`	select	`none`	Shadow `nonevar(--bs-box-shadow-sm)var(--bs-box-shadow)var(--bs-box-shadow-lg)` Shown when show_breadcrumbs = yes

Footer (20)

Key	Type	Default	Label and notes
`footer_background_type`	select	`solid`	Background type `solidgradientimage`
`footer_background_color`	color	`#202A23`	Footer background
`footer_gradient_preset`	image-select	`custom`	Gradient preset `custombrandaurorasunsetoceanmidnightforestemberorchidgraphite` Shown when footer_background_type = gradient
`footer_gradient_from`	color	`#202A23`	Gradient start Shown when footer_background_type = gradient and footer_gradient_preset = custom
`footer_gradient_to`	color	`#345D32`	Gradient end Shown when footer_background_type = gradient and footer_gradient_preset = custom
`footer_gradient_style`	select	`diagonal`	Gradient style `verticalhorizontaldiagonalglow-topglow-corner` Shown when footer_background_type = gradient and footer_gradient_preset = custom
`footer_background_image`	file	empty	Background image Shown when footer_background_type = image
`footer_background_position`	select	`center`	Image position `centercenter topcenter bottomleft centerright center` Shown when footer_background_type = image
`footer_background_size`	select	`cover`	Image size `covercontainauto` Shown when footer_background_type = image
`footer_background_repeat`	select	`no-repeat`	Image repeat `no-repeatrepeatrepeat-xrepeat-y` Shown when footer_background_type = image
`footer_overlay_color`	color	`#000000`	Overlay color Shown when footer_background_type = image
`footer_overlay_opacity`	range	`0.6`	Overlay opacity Shown when footer_background_type = image
`footer_text_color`	color	`#F7F9F4`	Footer text
`footer_link_color`	color	`#F7F9F4`	Footer link
`footer_link_hover_color`	color	`#A6F2DE`	Footer link hover
`footer_layout`	image-select	`columns`	Widgets layout `columnswide-brandcenteredbannerwide-endtwo-uplead-stackcardsruled`
`footer_copyright_width`	select	`container`	Copyright bar width `containerfluid` Shown when footer_copyright_bar = true
`footer_shape`	image-select	`none`	Top edge shape `noneskylinetreelinehillstornbubblesstairsequalizerhalftonestampmeadowsunrise`
`footer_shape_size`	select	`md`	Top edge shape size `smmdlg` Shown when footer_shape = skyline, treeline, hills, torn, bubbles, stairs, equalizer, halftone, stamp, meadow, sunrise
`footer_padding`	spacing	`0 0 0 0`	Footer padding