{
  "id": "salesforce",
  "version": "1.0.0",
  "name": "Salesforce",
  "description": "Salesforce is the enterprise CRM company behind the Sales Cloud, Service Cloud, Marketing Cloud, Data Cloud, MuleSoft, Tableau, and Slack product families. Salesforce Lightning Design System (SLDS) is the open-source design system that powers Lightning Experience and the Aloha admin surfaces. The signature brand color is Salesforce Blue (Palette Blue 50, #0176D3) — the canonical SLDS `BRAND_PRIMARY` interactive color across light themes. Warm Gray is the documented default neutral scale; semantic tokens map to Green 50 (success), Red 50 (error), Yellow 50 (warning). The proprietary typeface is Salesforce Sans (and SF Sans Display for marketing); it is not publicly licensed, so this atom references Inter as the open rendering substitute.\n",
  "provenance": {
    "source": "https://www.lightningdesignsystem.com/",
    "license": "Proprietary — All Rights Reserved (design tokens BSD-3-Clause)",
    "attribution": "Salesforce Lightning Design System design tokens are licensed BSD-3-Clause (see the matching palette atom). The Salesforce cloud-mark wordmark, the Salesforce Sans typeface family, and the Salesforce, Lightning, SLDS, Sales Cloud, Service Cloud, Marketing Cloud, Data Cloud, MuleSoft, Tableau, and Slack trademarks are property of salesforce.com inc.\n",
    "importedDate": "2026-05-19",
    "notes": "SLDS's published `BRAND_PRIMARY` alias resolves to PALETTE_BLUE_50 (#0176D3); the older theme exposes that swatch as `--slds-g-color-brand-base-50`. Salesforce Sans is not publicly licensed; Inter is referenced as the rendering substitute for sans on both heading and body. Slack — acquired by Salesforce in 2021 — has its own separate brand atom (`slack@1`) in this catalogue and is NOT reskinned to SLDS.\n"
  },
  "tags": [
    "salesforce",
    "slds",
    "lightning",
    "design-system",
    "crm",
    "enterprise"
  ],
  "palette": {
    "ref": "salesforce@1.0.0",
    "swatches": [
      {
        "id": "warm-gray-1",
        "name": "Warm Gray 1",
        "value": "#FFFFFF",
        "description": "Light canvas.",
        "aliases": []
      },
      {
        "id": "warm-gray-2",
        "name": "Warm Gray 2",
        "value": "#FAFAF9",
        "description": "Light surface.",
        "aliases": []
      },
      {
        "id": "warm-gray-3",
        "name": "Warm Gray 3",
        "value": "#F3F2F2",
        "aliases": []
      },
      {
        "id": "warm-gray-4",
        "name": "Warm Gray 4",
        "value": "#ECEBEA",
        "aliases": []
      },
      {
        "id": "warm-gray-5",
        "name": "Warm Gray 5",
        "value": "#DDDBDA",
        "description": "Default border on light.",
        "aliases": []
      },
      {
        "id": "warm-gray-6",
        "name": "Warm Gray 6",
        "value": "#C9C7C5",
        "aliases": []
      },
      {
        "id": "warm-gray-7",
        "name": "Warm Gray 7",
        "value": "#B0ADAB",
        "aliases": []
      },
      {
        "id": "warm-gray-8",
        "name": "Warm Gray 8",
        "value": "#969492",
        "aliases": []
      },
      {
        "id": "warm-gray-9",
        "name": "Warm Gray 9",
        "value": "#706E6B",
        "description": "Secondary text on light.",
        "aliases": []
      },
      {
        "id": "warm-gray-10",
        "name": "Warm Gray 10",
        "value": "#514F4D",
        "aliases": []
      },
      {
        "id": "warm-gray-11",
        "name": "Warm Gray 11",
        "value": "#3E3E3C",
        "aliases": []
      },
      {
        "id": "warm-gray-12",
        "name": "Warm Gray 12",
        "value": "#2B2826",
        "description": "Dark surface.",
        "aliases": []
      },
      {
        "id": "warm-gray-13",
        "name": "Warm Gray 13",
        "value": "#080707",
        "description": "Primary text on light; dark canvas.",
        "aliases": []
      },
      {
        "id": "cool-gray-2",
        "name": "Cool Gray 2",
        "value": "#F9F9FA",
        "aliases": []
      },
      {
        "id": "cool-gray-9",
        "name": "Cool Gray 9",
        "value": "#6B6D70",
        "aliases": []
      },
      {
        "id": "cool-gray-13",
        "name": "Cool Gray 13",
        "value": "#070808",
        "aliases": []
      },
      {
        "id": "blue-20",
        "name": "Blue 20",
        "value": "#032D60",
        "aliases": []
      },
      {
        "id": "blue-30",
        "name": "Blue 30",
        "value": "#014486",
        "aliases": []
      },
      {
        "id": "blue-40",
        "name": "Blue 40",
        "value": "#0B5CAB",
        "aliases": []
      },
      {
        "id": "blue-50",
        "name": "Blue 50",
        "value": "#0176D3",
        "description": "Salesforce BRAND_PRIMARY — the canonical SLDS blue.",
        "aliases": []
      },
      {
        "id": "blue-60",
        "name": "Blue 60",
        "value": "#1B96FF",
        "description": "Brand primary on dark surfaces.",
        "aliases": []
      },
      {
        "id": "blue-90",
        "name": "Blue 90",
        "value": "#D8E6FE",
        "aliases": []
      },
      {
        "id": "blue-95",
        "name": "Blue 95",
        "value": "#EEF4FF",
        "aliases": []
      },
      {
        "id": "green-20",
        "name": "Green 20",
        "value": "#1C3326",
        "aliases": []
      },
      {
        "id": "green-50",
        "name": "Green 50",
        "value": "#2E844A",
        "description": "Success on light surfaces.",
        "aliases": []
      },
      {
        "id": "green-60",
        "name": "Green 60",
        "value": "#3BA755",
        "aliases": []
      },
      {
        "id": "green-90",
        "name": "Green 90",
        "value": "#CDEFC4",
        "aliases": []
      },
      {
        "id": "red-40",
        "name": "Red 40",
        "value": "#BA0517",
        "aliases": []
      },
      {
        "id": "red-50",
        "name": "Red 50",
        "value": "#EA001E",
        "description": "Error / destructive (light).",
        "aliases": []
      },
      {
        "id": "red-60",
        "name": "Red 60",
        "value": "#FE5C4C",
        "description": "Error / destructive (dark).",
        "aliases": []
      },
      {
        "id": "red-90",
        "name": "Red 90",
        "value": "#FFCDC9",
        "aliases": []
      },
      {
        "id": "yellow-40",
        "name": "Yellow 40",
        "value": "#8C4B02",
        "aliases": []
      },
      {
        "id": "yellow-50",
        "name": "Yellow 50",
        "value": "#A86403",
        "description": "Warning on light surfaces.",
        "aliases": []
      },
      {
        "id": "yellow-60",
        "name": "Yellow 60",
        "value": "#CA8501",
        "aliases": []
      },
      {
        "id": "yellow-90",
        "name": "Yellow 90",
        "value": "#FCEAB3",
        "aliases": []
      },
      {
        "id": "orange-50",
        "name": "Orange 50",
        "value": "#A96404",
        "aliases": []
      },
      {
        "id": "orange-60",
        "name": "Orange 60",
        "value": "#DD7A01",
        "aliases": []
      },
      {
        "id": "orange-70",
        "name": "Orange 70",
        "value": "#FE9339",
        "aliases": []
      },
      {
        "id": "cloud-blue-50",
        "name": "Cloud Blue 50",
        "value": "#107CAD",
        "aliases": []
      },
      {
        "id": "cloud-blue-70",
        "name": "Cloud Blue 70",
        "value": "#1AB9FF",
        "aliases": []
      },
      {
        "id": "teal-50",
        "name": "Teal 50",
        "value": "#0B827C",
        "aliases": []
      },
      {
        "id": "teal-60",
        "name": "Teal 60",
        "value": "#06A59A",
        "aliases": []
      },
      {
        "id": "pink-50",
        "name": "Pink 50",
        "value": "#E3066A",
        "aliases": []
      },
      {
        "id": "pink-60",
        "name": "Pink 60",
        "value": "#FF538A",
        "aliases": []
      },
      {
        "id": "indigo-50",
        "name": "Indigo 50",
        "value": "#5867E8",
        "aliases": []
      },
      {
        "id": "indigo-60",
        "name": "Indigo 60",
        "value": "#7F8CED",
        "aliases": []
      },
      {
        "id": "purple-50",
        "name": "Purple 50",
        "value": "#9050E9",
        "aliases": []
      },
      {
        "id": "purple-60",
        "name": "Purple 60",
        "value": "#AD7BEE",
        "aliases": []
      },
      {
        "id": "violet-50",
        "name": "Violet 50",
        "value": "#BA01FF",
        "aliases": []
      },
      {
        "id": "violet-60",
        "name": "Violet 60",
        "value": "#CB65FF",
        "aliases": []
      }
    ],
    "modes": {
      "light": {
        "roles": {
          "background": "warm-gray-1",
          "surface": "warm-gray-2",
          "surface-elevated": "warm-gray-1",
          "text-primary": "warm-gray-13",
          "text-secondary": "warm-gray-9",
          "text-tertiary": "warm-gray-10",
          "primary": "blue-50",
          "primary-hover": "blue-40",
          "accent": "blue-50",
          "accent-hover": "blue-40",
          "warning": "yellow-50",
          "warning-hover": "yellow-40",
          "error": "red-50",
          "success": "green-50",
          "border": "warm-gray-5"
        }
      },
      "dark": {
        "roles": {
          "background": "warm-gray-13",
          "surface": "warm-gray-12",
          "surface-elevated": "warm-gray-11",
          "text-primary": "warm-gray-2",
          "text-secondary": "warm-gray-6",
          "text-tertiary": "warm-gray-7",
          "primary": "blue-60",
          "primary-hover": "blue-50",
          "accent": "blue-60",
          "accent-hover": "blue-50",
          "warning": "yellow-60",
          "warning-hover": "yellow-50",
          "error": "red-60",
          "success": "green-60",
          "border": "warm-gray-11"
        }
      }
    }
  },
  "fonts": [
    {
      "role": "heading",
      "ref": "inter@1.0.0",
      "family": "Inter",
      "classification": "sans-serif",
      "source": {
        "kind": "google-fonts",
        "family": "Inter",
        "url": "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
      },
      "fallbackStack": [
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "weight": 200,
          "style": "normal"
        },
        {
          "weight": 200,
          "style": "italic"
        },
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 300,
          "style": "italic"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "italic"
        },
        {
          "weight": 500,
          "style": "normal"
        },
        {
          "weight": 500,
          "style": "italic"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "italic"
        },
        {
          "weight": 700,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "italic"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        },
        {
          "weight": 900,
          "style": "normal"
        },
        {
          "weight": 900,
          "style": "italic"
        }
      ]
    },
    {
      "role": "body",
      "ref": "inter@1.0.0",
      "family": "Inter",
      "classification": "sans-serif",
      "source": {
        "kind": "google-fonts",
        "family": "Inter",
        "url": "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
      },
      "fallbackStack": [
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "weight": 200,
          "style": "normal"
        },
        {
          "weight": 200,
          "style": "italic"
        },
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 300,
          "style": "italic"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "italic"
        },
        {
          "weight": 500,
          "style": "normal"
        },
        {
          "weight": 500,
          "style": "italic"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "italic"
        },
        {
          "weight": 700,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "italic"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        },
        {
          "weight": 900,
          "style": "normal"
        },
        {
          "weight": 900,
          "style": "italic"
        }
      ]
    },
    {
      "role": "mono",
      "ref": "jetbrainsmono-nerdfont@1.0.0",
      "family": "JetBrainsMono Nerd Font",
      "classification": "monospace",
      "source": {
        "kind": "external",
        "family": "JetBrainsMono Nerd Font",
        "notes": "Nerd-Font-patched build of JetBrains Mono. Not available via Google Fonts. Download woff2/ttf files from the Nerd Fonts GitHub release and self-host, or install system-wide for terminal/IDE use.\n"
      },
      "fallbackStack": [
        "JetBrains Mono",
        "Fira Code",
        "Menlo",
        "Monaco",
        "Consolas",
        "Liberation Mono",
        "monospace"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "weight": 200,
          "style": "normal"
        },
        {
          "weight": 200,
          "style": "italic"
        },
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 300,
          "style": "italic"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "italic"
        },
        {
          "weight": 500,
          "style": "normal"
        },
        {
          "weight": 500,
          "style": "italic"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "italic"
        },
        {
          "weight": 700,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "italic"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        }
      ]
    }
  ],
  "roles": {
    "colors": {
      "identity": "warm-gray-1",
      "on-identity": "warm-gray-13",
      "primary": "blue-50",
      "primary-hover": "blue-40",
      "accent": "blue-50",
      "accent-hover": "blue-40",
      "mark": "blue-50",
      "success": "green-50",
      "warning": "yellow-50",
      "error": "red-50",
      "text-primary-light": "warm-gray-13",
      "text-primary-dark": "warm-gray-2",
      "background-light": "warm-gray-1",
      "background-dark": "warm-gray-13",
      "surface-light": "warm-gray-2",
      "surface-dark": "warm-gray-12",
      "text-secondary-light": "warm-gray-9",
      "text-tertiary-light": "warm-gray-10",
      "border-light": "warm-gray-5"
    },
    "typography": {
      "display": "heading",
      "prose": "body",
      "code": "mono"
    }
  },
  "assets": [],
  "rules": [
    {
      "type": "colorChoice",
      "target": "roles.colors.primary",
      "severity": "error",
      "rationale": "SLDS's `BRAND_PRIMARY` alias resolves to PALETTE_BLUE_50 (#0176D3); Blue 40 (#0B5CAB) is the documented active/pressed state on light, and Blue 60 (#1B96FF) is the dark-mode counterpart. Other chromatic 50-stops are reserved for semantic (red/yellow/green) and data-viz (pink/violet) roles and must not stand in for the primary brand color.\n",
      "allowed": [
        "blue-50",
        "blue-40",
        "blue-60"
      ],
      "forbidden": [
        "red-50",
        "green-50",
        "yellow-50",
        "orange-60",
        "pink-50",
        "violet-50"
      ]
    },
    {
      "type": "forbiddenTreatment",
      "target": "logo",
      "severity": "error",
      "rationale": "Salesforce's brand-use guidance prohibits stretching, rotating, recoloring, outlining, or applying decorative effects to the Salesforce cloud-mark wordmark or to the marks of cloud products (Sales Cloud, Service Cloud, etc.).\n",
      "treatments": [
        "stretched",
        "rotated",
        "recolored",
        "drop-shadow",
        "gradient-fill",
        "outlined",
        "on-busy-photo"
      ]
    },
    {
      "type": "contrastRatio",
      "target": "text-primary",
      "severity": "error",
      "rationale": "SLDS publishes WCAG 2.1 AA as its accessibility floor across Lightning surfaces. Warm Gray 13 (#080707) on Warm Gray 1 (#FFFFFF) clears AA at ~20:1, and Warm Gray 2 (#FAFAF9) on Warm Gray 13 clears AA at ~19:1.\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "contextRestriction",
      "target": "roles.colors.identity",
      "severity": "error",
      "rationale": "Salesforce's trademark guidance forbids using the Salesforce name, the cloud-mark, or the SLDS brand color treatment in third-party company names, domains, merchandise, or any context that implies affiliation or endorsement.\n",
      "forbiddenContexts": [
        "product-of-competitor",
        "merchandise",
        "endorsement-implication",
        "company-name-or-domain"
      ]
    },
    {
      "type": "contextRestriction",
      "target": "roles.colors.error",
      "severity": "error",
      "rationale": "SLDS's `color-text-error` and `color-background-destructive` tokens resolve to Red 50 (#EA001E) on light. Reusing it for confirmation or positive data points inverts the established semantic meaning across Lightning surfaces.\n",
      "allowedContexts": [
        "error-state",
        "destructive-action",
        "validation-failure"
      ],
      "forbiddenContexts": [
        "confirmation",
        "data-viz-positive"
      ]
    },
    {
      "type": "enumMembership",
      "target": "typography.heading.fontWeight",
      "severity": "warning",
      "rationale": "Salesforce Sans ships in Regular (400), Medium (500), Semibold (600), and Bold (700) — the weights SLDS's documented type ramp anchors on. Heavier display cuts are not part of the defined system ramp.\n",
      "allowed": [
        "400",
        "500",
        "600",
        "700"
      ]
    },
    {
      "type": "fontPairing",
      "target": "typography.display",
      "severity": "error",
      "rationale": "SLDS's documented type scale maintains at least a 1.5× ratio between heading and body to preserve the hierarchy Lightning components depend on at dense data-table densities.\n",
      "requires": "prose",
      "minSizeRatio": 1.5
    },
    {
      "type": "accessibilityRequirement",
      "target": "*",
      "severity": "error",
      "rationale": "WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. SLDS's published accessibility commitment treats AA as the floor for every Lightning component and the design tokens that back them.\n",
      "standard": "WCAG-AA",
      "criterion": "1.4.3"
    },
    {
      "type": "compositionConstraint",
      "target": "roles.colors.primary",
      "severity": "recommendation",
      "rationale": "Salesforce Blue is calibrated to read against the Warm Gray canvas (Warm Gray 1 / 2) on light surfaces and Warm Gray 13 on dark. Placing Blue 50 adjacent to pink-50, violet-50, or red-50 at equal weight produces chromatic conflict and breaks the calm, enterprise-confident voice SLDS surfaces depend on.\n",
      "pairsWith": [
        "warm-gray-1",
        "warm-gray-2",
        "warm-gray-13",
        "blue-95"
      ],
      "doesNotPairWith": [
        "pink-50",
        "violet-50",
        "red-50"
      ]
    },
    {
      "type": "variantSelection",
      "target": "logo",
      "severity": "error",
      "rationale": "On dark surfaces, use Salesforce's documented light-fill variant of the cloud-mark wordmark; inverting the blue mark on the fly produces an off-brand cyan that does not match Salesforce's published assets.\n",
      "when": {
        "backgroundColorScheme": "dark"
      },
      "use": "logo-light"
    }
  ]
}
