Edit Stripe tokens

{
  "color": {
    "brand": {
      "primary": {
        "$value": "#635BFF",
        "$type": "color",
        "$description": "Primary brand color for Stripe Payments, used in buttons, links, and active states"
      },
      "atlas": {
        "$value": "#FF6D42",
        "$type": "color",
        "$description": "Brand color for Atlas product line"
      },
      "hover": {
        "$value": "#0A2540",
        "$type": "color",
        "$description": "Hover state for primary brand elements"
      }
    },
    "text": {
      "primary": {
        "$value": "#0A2540",
        "$type": "color",
        "$description": "Primary text color for headings and body content"
      },
      "secondary": {
        "$value": "#425466",
        "$type": "color",
        "$description": "Secondary text color for descriptions and labels"
      },
      "tertiary": {
        "$value": "#697386",
        "$type": "color",
        "$description": "Tertiary text color for de-emphasized content"
      },
      "on-brand": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Text color when placed on brand-colored backgrounds"
      }
    },
    "background": {
      "primary": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Primary background color for main surfaces"
      },
      "secondary": {
        "$value": "#F6F9FC",
        "$type": "color",
        "$description": "Secondary background for cards and subtle surfaces"
      },
      "tertiary": {
        "$value": "#E3E8EE",
        "$type": "color",
        "$description": "Tertiary background for dividers and borders"
      }
    },
    "border": {
      "default": {
        "$value": "#E3E8EE",
        "$type": "color",
        "$description": "Default border color"
      },
      "focus": {
        "$value": "#635BFF",
        "$type": "color",
        "$description": "Border color for focused elements"
      }
    },
    "gradient": {
      "purple-start": {
        "$value": "#635BFF",
        "$type": "color",
        "$description": "Start color for purple gradient backgrounds"
      },
      "purple-end": {
        "$value": "#00D4FF",
        "$type": "color",
        "$description": "End color for purple-to-cyan gradient"
      },
      "orange-start": {
        "$value": "#FF6D42",
        "$type": "color",
        "$description": "Start color for orange gradient backgrounds"
      },
      "orange-end": {
        "$value": "#FFA742",
        "$type": "color",
        "$description": "End color for orange gradient"
      }
    },
    "success": {
      "$value": "#00D924",
      "$type": "color",
      "$description": "Success state color"
    },
    "check": {
      "$value": "#FF6D42",
      "$type": "color",
      "$description": "Checkmark and list item indicator color"
    }
  },
  "font": {
    "family": {
      "sans": {
        "$value": "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif",
        "$type": "fontFamily",
        "$description": "Primary sans-serif font stack"
      }
    },
    "size": {
      "xs": {
        "$value": "12px",
        "$type": "dimension",
        "$description": "Extra small text size"
      },
      "sm": {
        "$value": "14px",
        "$type": "dimension",
        "$description": "Small text size for labels and captions"
      },
      "base": {
        "$value": "16px",
        "$type": "dimension",
        "$description": "Base body text size"
      },
      "lg": {
        "$value": "18px",
        "$type": "dimension",
        "$description": "Large body text size"
      },
      "xl": {
        "$value": "24px",
        "$type": "dimension",
        "$description": "H4 heading size"
      },
      "2xl": {
        "$value": "32px",
        "$type": "dimension",
        "$description": "H3 heading size"
      },
      "3xl": {
        "$value": "48px",
        "$type": "dimension",
        "$description": "H2 heading size"
      },
      "4xl": {
        "$value": "56px",
        "$type": "dimension",
        "$description": "H1 heading size"
      },
      "5xl": {
        "$value": "72px",
        "$type": "dimension",
        "$description": "Hero heading size"
      }
    },
    "weight": {
      "regular": {
        "$value": "400",
        "$type": "fontWeight",
        "$description": "Regular font weight for body text"
      },
      "medium": {
        "$value": "500",
        "$type": "fontWeight",
        "$description": "Medium font weight for emphasis"
      },
      "semibold": {
        "$value": "600",
        "$type": "fontWeight",
        "$description": "Semibold font weight for headings"
      }
    },
    "lineHeight": {
      "tight": {
        "$value": "1.1",
        "$type": "number",
        "$description": "Tight line height for large headings"
      },
      "snug": {
        "$value": "1.2",
        "$type": "number",
        "$description": "Snug line height for headings"
      },
      "base": {
        "$value": "1.5",
        "$type": "number",
        "$description": "Base line height for body text"
      },
      "relaxed": {
        "$value": "1.6",
        "$type": "number",
        "$description": "Relaxed line height for large body text"
      }
    }
  },
  "spacing": {
    "1": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Smallest spacing unit"
    },
    "2": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Small spacing for tight gaps"
    },
    "3": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Button vertical padding"
    },
    "4": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Default spacing unit"
    },
    "5": {
      "$value": "20px",
      "$type": "dimension",
      "$description": "Medium spacing"
    },
    "6": {
      "$value": "24px",
      "$type": "dimension",
      "$description": "Button horizontal padding, standard gaps"
    },
    "8": {
      "$value": "32px",
      "$type": "dimension",
      "$description": "Large spacing between sections"
    },
    "10": {
      "$value": "40px",
      "$type": "dimension",
      "$description": "Card padding"
    },
    "12": {
      "$value": "48px",
      "$type": "dimension",
      "$description": "Modal and section padding"
    },
    "16": {
      "$value": "64px",
      "$type": "dimension",
      "$description": "Large section spacing"
    },
    "20": {
      "$value": "80px",
      "$type": "dimension",
      "$description": "Hero section vertical spacing"
    },
    "30": {
      "$value": "120px",
      "$type": "dimension",
      "$description": "Extra large spacing"
    }
  },
  "radius": {
    "sm": {
      "$value": "6px",
      "$type": "dimension",
      "$description": "Small radius for input fields"
    },
    "md": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Medium radius for buttons"
    },
    "lg": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Large radius for cards"
    },
    "xl": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Extra large radius for modals"
    },
    "full": {
      "$value": "9999px",
      "$type": "dimension",
      "$description": "Full radius for pills and circular elements"
    }
  },
  "shadow": {
    "sm": {
      "$value": "0 2px 4px rgba(0, 0, 0, 0.06)",
      "$type": "shadow",
      "$description": "Small shadow for hover states"
    },
    "md": {
      "$value": "0 4px 8px rgba(0, 0, 0, 0.08)",
      "$type": "shadow",
      "$description": "Medium shadow for cards"
    },
    "lg": {
      "$value": "0 8px 16px rgba(0, 0, 0, 0.1)",
      "$type": "shadow",
      "$description": "Large shadow for elevated elements"
    },
    "xl": {
      "$value": "0 12px 24px rgba(0, 0, 0, 0.12)",
      "$type": "shadow",
      "$description": "Extra large shadow for modals"
    },
    "focus": {
      "$value": "0 0 0 3px rgba(99, 91, 255, 0.3)",
      "$type": "shadow",
      "$description": "Focus ring shadow"
    }
  },
  "border": {
    "width": {
      "default": {
        "$value": "1px",
        "$type": "dimension",
        "$description": "Default border width"
      },
      "thick": {
        "$value": "2px",
        "$type": "dimension",
        "$description": "Thick border for focus states"
      }
    }
  }
}