Skip to content

Instantly share code, notes, and snippets.

@brettsmason

brettsmason/theme.json

Created August 2, 2024 09:29
Show Gist options
  • Save brettsmason/e50312a27f4613e381a12af7ce9d9444 to your computer and use it in GitHub Desktop.
Save brettsmason/e50312a27f4613e381a12af7ce9d9444 to your computer and use it in GitHub Desktop.
Download ZIP
theme.json example
Raw
theme.json
{
"$schema": "https://schemas.wp.org/trunk/theme.json",
"version": 3,
"settings": {
"appearanceTools": false,
"useRootPaddingAwareAlignments": true,
"background": {
"backgroundImage": false,
"backgroundSize": false
},
"blocks": {
"core/button": {
"color": {
"background": true
}
},
"core/column": {
"spacing": {
"units": [
"%"
]
}
},
"core/group": {
"color": {
"background": true
}
},
"core/heading": {
"color": {
"text": true,
"palette": [
{
"name": "Primary",
"slug": "primary",
"color": "var:custom|color|primary|500"
},
{
"name": "Secondary",
"slug": "secondary",
"color": "var:custom|color|secondary|500"
},
{
"name": "Tertiary",
"slug": "tertiary",
"color": "var:custom|color|tertiary|500"
}
]
}
}
},
"border": {
"color": false,
"radius": false,
"style": false,
"width": false
},
"color": {
"background": false,
"custom": false,
"customDuotone": false,
"customGradient": false,
"defaultDuotone": false,
"defaultGradients": false,
"defaultPalette": false,
"duotone": [],
"gradients": [],
"link": false,
"palette": [
{
"name": "Primary",
"slug": "primary",
"color": "var(--wp--custom--color--primary)"
},
{
"name": "Secondary",
"slug": "secondary",
"color": "var(--wp--custom--color--secondary)"
},
{
"name": "Tertiary",
"slug": "tertiary",
"color": "var(--wp--custom--color--tertiary)"
}
],
"text": false
},
"custom": {
"color": {
"neutral": {
"0": "#ffffff",
"50": "#F5F6F7",
"100": "#EDEFF1",
"200": "#D8DCDF",
"300": "#B5BEC4",
"400": "#8D9AA3",
"500": "#6F7E88",
"600": "#5A666F",
"700": "#49535B",
"800": "#3F474D",
"900": "#383D42",
"950": "#25282C",
"1000": "#00000"
},
"primary": {
"50": "#FEF2F3",
"100": "#FEE5E7",
"200": "#FCCFD5",
"300": "#F9A8B2",
"400": "#F4788A",
"500": "#E93756",
"600": "#D7274F",
"700": "#B51B40",
"800": "#98193C",
"900": "#821939",
"950": "#48091B"
},
"secondary": {
"50": "#EEF2FF",
"100": "#E0E7FF",
"200": "#C6D1FF",
"300": "#A4B2FD",
"400": "#8089F9",
"500": "#6162F3",
"600": "#4F44E7",
"700": "#4436CC",
"800": "#382FA4",
"900": "#312D82",
"950": "#201C50"
},
"tertiary": {
"50": "#F1F9FA",
"100": "#DBEDF2",
"200": "#BBDDE6",
"300": "#8CC4D4",
"400": "#56A2BA",
"500": "#3F91AD",
"600": "#336E87",
"700": "#2F5A6F",
"800": "#2D4C5D",
"900": "#2A414F",
"950": "#172935"
},
"error": {
"50": "#FEF2F2",
"100": "#FEE2E2",
"200": "#FECACA",
"300": "#FCA5A5",
"400": "#F87171",
"500": "#EF4444",
"600": "#DC2626",
"700": "#B91C1C",
"800": "#991B1B",
"900": "#7F1D1D",
"950": "#450A0A"
},
"warning": {
"50": "#FFFFEA",
"100": "#FFFBC5",
"200": "#FFF885",
"300": "#FFED46",
"400": "#FFDF1B",
"500": "#FFBF00",
"600": "#E29300",
"700": "#BB6802",
"800": "#985008",
"900": "#7C420B",
"950": "#482200"
},
"success": {
"50": "#EDFCF4",
"100": "#D3F8E3",
"200": "#AAF0CD",
"300": "#73E2B1",
"400": "#3BCC91",
"500": "#19BC7F",
"600": "#0C8F61",
"700": "#097350",
"800": "#0A5B41",
"900": "#094B36",
"950": "#042A1F"
}
},
"layout": {
"content": "768px",
"wide": "1280px"
},
"spacing": {
"blockGap": "var(--wp--preset--spacing--md)",
"edge": "clamp(var(--wp--preset--spacing--lg), 5.3333px + 5.8333vw, var(--wp--preset--spacing--3-xl))",
"group": "var(--wp--preset--spacing--4-xl)"
},
"lineHeight": {
"none": "1",
"tight": "1.25",
"snug": "1.375",
"normal": "1.5",
"relaxed": "1.625",
"loose": "2"
},
"letterSpacing": {
"tighter": "-0.05em",
"tight": "-0.025em",
"normal": "0em",
"wide": "0.025em",
"wider": "0.05em",
"widest": "0.1em"
},
"borderRadius": {
"none": "0",
"sm": "0.125rem",
"md": "0.375rem",
"lg": "0.5rem",
"xl": "0.75rem",
"2-xl": "1rem",
"3-xl": "1.5rem",
"full": "9999px"
},
"boxShadow": {
"sm": "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
"md": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
"lg": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
"xl": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
"2-xl": "0 25px 50px -12px rgba(0, 0, 0, 0.25)"
},
"transitionDuration": {
"quick": "100ms",
"base": "250ms",
"slow": "600ms"
}
},
"dimensions": {
"aspectRatio": true,
"aspectRatios": [
{
"name": "Square - 1:1",
"slug": "square",
"ratio": "1"
},
{
"name": "Standard - 4:3",
"slug": "4-3",
"ratio": "4/3"
},
{
"name": "Classic - 3:2",
"slug": "3-2",
"ratio": "3/2"
},
{
"name": "Wide - 16:9",
"slug": "16-9",
"ratio": "16/9"
},
{
"name": "Extra Wide (Univisium) - 2:1",
"slug": "2-1",
"ratio": "2/1"
},
{
"name": "Cinema - 21:9",
"slug": "21-9",
"ratio": "21/9"
},
{
"name": "Portrait - 3:4",
"slug": "3-4",
"ratio": "3/4"
},
{
"name": "Classic Portrait - 2:3",
"slug": "2-3",
"ratio": "2/3"
},
{
"name": "Tall - 9:16",
"slug": "9-16",
"ratio": "9/16"
}
],
"defaultAspectRatios": false,
"minHeight": false
},
"layout": {
"allowCustomContentAndWideSize": false,
"allowEditing": true,
"contentSize": "var:custom|layout|content",
"wideSize": "var(--wp--custom--layout--wide)"
},
"lightbox": {
"enabled": true,
"allowEditing": false
},
"position": {
"sticky": false
},
"shadow": {
"defaultPresets": false,
"presets": [
{
"name": "small",
"slug": "sm",
"shadow": "var:custom|box-shadow|sm"
}
]
},
"spacing": {
"blockGap": true,
"defaultSpacingSizes": false,
"customSpacingSize": false,
"margin": true,
"padding": true,
"spacingSizes": [
{
"name": "4px",
"size": "4px",
"slug": "3-xs"
},
{
"name": "8px",
"size": "8px",
"slug": "2-xs"
},
{
"name": "12px",
"size": "clamp(10px, 6.6667px + 0.4167vw, 12px)",
"slug": "xs"
},
{
"name": "16px",
"size": "clamp(12px, 10.6667px + 0.4167vw, 16px)",
"slug": "sm"
},
{
"name": "24px",
"size": "clamp(16px, 13.3333px + 0.8333vw, 24px)",
"slug": "md"
},
{
"name": "32px",
"size": "clamp(24px, 21.3333px + 0.8333vw, 32px)",
"slug": "lg"
},
{
"name": "48px",
"size": "clamp(32px, 26.6667px + 1.6667vw, 48px)",
"slug": "xl"
},
{
"name": "64px",
"size": "clamp(40px, 42.6667px + 1.6667vw, 64px)",
"slug": "2-xl"
},
{
"name": "80px",
"size": "clamp(48px, 37.3333px + 3.3333vw, 80px)",
"slug": "3-xl"
},
{
"name": "96px",
"size": "clamp(64px, 53.3333px + 3.3333vw, 96px)",
"slug": "4-xl"
},
{
"name": "112px",
"size": "clamp(80px, 69.3333px + 3.3333vw, 112px)",
"slug": "5-xl"
},
{
"name": "128px",
"size": "clamp(96px, 85.3333px + 3.3333vw, 128px)",
"slug": "6-xl"
},
{
"name": "154px",
"size": "clamp(128px, 119.3333px + 2.7083vw, 154px)",
"slug": "7-xl"
},
{
"name": "186px",
"size": "clamp(154px, 143.3333px + 3.3333vw, 186px)",
"slug": "8-xl"
}
],
"units": [
"%",
"px",
"em",
"rem",
"vh",
"vw"
]
},
"typography": {
"customFontSize": false,
"defaultFontSizes": false,
"dropCap": false,
"fluid": true,
"fontFamilies": [
{
"name": "Sans",
"slug": "sans",
"fontFamily": "ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\""
},
{
"name": "Serif",
"slug": "serif",
"fontFamily": "ui-serif, Georgia, Cambria, \"Times New Roman\", Times, serif"
}
],
"fontSizes": [
{
"name": "2XS",
"slug": "2-xs",
"size": "15px",
"fluid": {
"min": "13px",
"max": "15px"
}
},
{
"name": "XS",
"slug": "xs",
"size": "16px",
"fluid": {
"min": "16px",
"max": "16px"
}
},
{
"name": "Small",
"slug": "sm",
"size": "18px",
"fluid": {
"min": "18px",
"max": "18px"
}
},
{
"name": "Medium",
"slug": "md",
"size": "20px",
"fluid": {
"min": "18px",
"max": "20px"
}
},
{
"name": "Large",
"slug": "lg",
"size": "24px",
"fluid": {
"min": "24px",
"max": "24px"
}
},
{
"name": "XL",
"slug": "xl",
"size": "35px",
"fluid": {
"min": "22px",
"max": "35px"
}
},
{
"name": "2XL",
"slug": "2-xl",
"size": "44px",
"fluid": {
"min": "25px",
"max": "44px"
}
},
{
"name": "3XL",
"slug": "3-xl",
"size": "50px",
"fluid": {
"min": "37px",
"max": "50px"
}
},
{
"name": "4XL",
"slug": "4-xl",
"size": "63px",
"fluid": {
"min": "43px",
"max": "63px"
}
}
],
"fontStyle": false,
"fontWeight": false,
"letterSpacing": false,
"lineHeight": false,
"textColumns": true,
"textDecoration": false,
"textTransform": false
}
},
"styles": {
"spacing": {
"blockGap": "var(--wp--custom--spacing--block-gap)",
"padding": {
"left": "var(--wp--custom--spacing--edge)",
"right": "var(--wp--custom--spacing--edge)"
}
}
},
"customTemplates": [],
"templateParts": [
{
"area": "header",
"name": "header",
"title": "Header"
},
{
"area": "footer",
"name": "footer",
"title": "Footer"
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment