{
  "$schema": "https://tr.designtokens.org/format/",
  "$description": "Layout tokens for Carbon Design System — spacing, container, icon size, fluid spacing, size, border-radius, and deprecated layout scale.",
  "spacing": {
    "$description": "Spacing scale based on the 8px mini-unit grid.",
    "spacing-01": {
      "$type": "dimension",
      "$value": 0.25,
      "$description": "Spacing token — 2px. Use for the smallest internal padding or gaps between tightly-packed elements.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-02": {
      "$type": "dimension",
      "$value": 0.5,
      "$description": "Spacing token — 4px. Use for compact padding within dense components.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-03": {
      "$type": "dimension",
      "$value": 1,
      "$description": "Spacing token — 8px. Default small spacing unit for inset padding and icon gaps.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-04": {
      "$type": "dimension",
      "$value": 1.5,
      "$description": "Spacing token — 12px. Use for comfortable inset padding in small components.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-05": {
      "$type": "dimension",
      "$value": 2,
      "$description": "Spacing token — 16px. Standard spacing unit; use for typical component padding and gutters.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-06": {
      "$type": "dimension",
      "$value": 3,
      "$description": "Spacing token — 24px. Use for section padding and medium gaps between components.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-07": {
      "$type": "dimension",
      "$value": 4,
      "$description": "Spacing token — 32px. Use for group separation and larger layout gaps.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-08": {
      "$type": "dimension",
      "$value": 5,
      "$description": "Spacing token — 40px. Use for generous padding between distinct sections.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-09": {
      "$type": "dimension",
      "$value": 6,
      "$description": "Spacing token — 48px. Use for large vertical rhythm and section separation.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-10": {
      "$type": "dimension",
      "$value": 8,
      "$description": "Spacing token — 64px. Use for major page section gaps.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-11": {
      "$type": "dimension",
      "$value": 10,
      "$description": "Spacing token — 80px. Use for hero and large feature-area spacing.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-12": {
      "$type": "dimension",
      "$value": 12,
      "$description": "Spacing token — 96px. Use for very large layout separations.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "spacing-13": {
      "$type": "dimension",
      "$value": 20,
      "$description": "Spacing token — 160px. Use for the largest page-level spacing needs.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    }
  },
  "fluid-spacing": {
    "$description": "Viewport-relative fluid spacing tokens.",
    "fluid-spacing-01": {
      "$type": "dimension",
      "$value": "0",
      "$description": "Fluid spacing token — 0. Use when no fluid spacing is required."
    },
    "fluid-spacing-02": {
      "$type": "dimension",
      "$value": "2vw",
      "$description": "Fluid spacing token — 2vw. Use for viewport-proportional small spacing in fluid layouts."
    },
    "fluid-spacing-03": {
      "$type": "dimension",
      "$value": "5vw",
      "$description": "Fluid spacing token — 5vw. Use for medium fluid spacing that scales with the viewport."
    },
    "fluid-spacing-04": {
      "$type": "dimension",
      "$value": "10vw",
      "$description": "Fluid spacing token — 10vw. Use for large fluid spacing in full-bleed or hero sections."
    }
  },
  "container": {
    "$description": "Interactive element container height tokens.",
    "container-01": {
      "$type": "dimension",
      "$value": 3,
      "$description": "Container height token — 24px. Minimum interactive target height for compact UI elements.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "container-02": {
      "$type": "dimension",
      "$value": 4,
      "$description": "Container height token — 32px. Small interactive element height.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "container-03": {
      "$type": "dimension",
      "$value": 5,
      "$description": "Container height token — 40px. Default interactive element height.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "container-04": {
      "$type": "dimension",
      "$value": 6,
      "$description": "Container height token — 48px. Large interactive element height.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    },
    "container-05": {
      "$type": "dimension",
      "$value": 8,
      "$description": "Container height token — 64px. Extra-large interactive element height.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits"
        }
      }
    }
  },
  "size": {
    "$description": "Named component size tokens (xs–2xl).",
    "size-xs": {
      "$type": "dimension",
      "$value": 24,
      "$description": "Component size token — XSmall, 24px. Use for the smallest component variant.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "size-sm": {
      "$type": "dimension",
      "$value": 32,
      "$description": "Component size token — Small, 32px.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "size-md": {
      "$type": "dimension",
      "$value": 40,
      "$description": "Component size token — Medium, 40px. Default component size.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "size-lg": {
      "$type": "dimension",
      "$value": 48,
      "$description": "Component size token — Large, 48px.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "size-xl": {
      "$type": "dimension",
      "$value": 64,
      "$description": "Component size token — XLarge, 64px.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "size-2xl": {
      "$type": "dimension",
      "$value": 80,
      "$description": "Component size token — 2XLarge, 80px.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    }
  },
  "icon-size": {
    "$description": "Icon size tokens.",
    "icon-size-01": {
      "$type": "dimension",
      "$value": "1rem",
      "$description": "Icon size token — 16px. Standard icon size for inline and UI icons."
    },
    "icon-size-02": {
      "$type": "dimension",
      "$value": "1.25rem",
      "$description": "Icon size token — 20px. Use for slightly larger icons that need more visual weight."
    }
  },
  "border-radius": {
    "$description": "Border radius tokens for component rounding.",
    "border-radius-00": {
      "$type": "dimension",
      "$value": "0px",
      "$description": "Border radius token — 0. No rounding; use for sharp-cornered elements."
    },
    "border-radius-02": {
      "$type": "dimension",
      "$value": 2,
      "$description": "Border radius token — 2px. Subtle rounding for small components like tags and badges.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "border-radius-04": {
      "$type": "dimension",
      "$value": 4,
      "$description": "Border radius token — 4px. Default rounding for inputs, cards, and general components.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "border-radius-08": {
      "$type": "dimension",
      "$value": 8,
      "$description": "Border radius token — 8px. Moderate rounding for panels, modals, and containers.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "border-radius-16": {
      "$type": "dimension",
      "$value": 16,
      "$description": "Border radius token — 16px. Strong rounding for large cards or featured containers.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "border-radius-24": {
      "$type": "dimension",
      "$value": 24,
      "$description": "Border radius token — 24px. Very rounded corners for pill-adjacent components.",
      "$extensions": {
        "carbon.layout": {
          "converter": "rem"
        }
      }
    },
    "border-radius-max": {
      "$type": "dimension",
      "$value": "999999px",
      "$description": "Border radius token — pill/fully rounded. Use for pill buttons, chips, and circular elements."
    }
  },
  "layout": {
    "$description": "Deprecated layout scale tokens. Replaced by the spacing scale — do not use in new work.",
    "layout-01": {
      "$type": "dimension",
      "$value": 2,
      "$description": "Deprecated layout token — 16px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-02": {
      "$type": "dimension",
      "$value": 3,
      "$description": "Deprecated layout token — 24px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-03": {
      "$type": "dimension",
      "$value": 4,
      "$description": "Deprecated layout token — 32px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-04": {
      "$type": "dimension",
      "$value": 6,
      "$description": "Deprecated layout token — 48px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-05": {
      "$type": "dimension",
      "$value": 8,
      "$description": "Deprecated layout token — 64px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-06": {
      "$type": "dimension",
      "$value": 12,
      "$description": "Deprecated layout token — 96px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    },
    "layout-07": {
      "$type": "dimension",
      "$value": 20,
      "$description": "Deprecated layout token — 160px. Replaced by spacing scale. Do not use in new work.",
      "$extensions": {
        "carbon.layout": {
          "converter": "miniUnits",
          "deprecated": true
        }
      }
    }
  }
}