{
  "id": "digitalocean",
  "version": "1.0.0",
  "name": "DigitalOcean",
  "description": "DigitalOcean, LLC is the developer-cloud company providing Droplets (VMs), App Platform (PaaS), Spaces (object storage), managed databases, Kubernetes, and an opinionated developer- forward cloud experience aimed at individual builders, startups, and small teams. The brand identity is anchored on DigitalOcean Blue (#0080FF) — the fill of the waving-ocean mark — paired with a deeper Navy used in dark-mode marketing. The voice is developer-direct and tutorial-forward: the DigitalOcean Community tutorials carry a substantial portion of the brand's voice, and the marketing surfaces match — short sentences, runnable commands, and concrete pricing.\n",
  "provenance": {
    "source": "https://www.digitalocean.com/press",
    "license": "Proprietary — All Rights Reserved",
    "attribution": "DigitalOcean and the DigitalOcean logo are trademarks of DigitalOcean, LLC. Brand colors and identity guidance documented here are derived from the DigitalOcean press / brand resources page (digitalocean.com/press) and the visible style values across digitalocean.com and the DigitalOcean control panel.\n",
    "importedDate": "2026-05-18",
    "notes": "Brand-atoms' read of DigitalOcean's publicly available brand surface. This file is not an official DigitalOcean brand- guidelines document. No asset files are bundled here — the waving-ocean mark is trademarked.\n"
  },
  "tags": [
    "tech",
    "cloud",
    "digitalocean",
    "developer-cloud",
    "infrastructure"
  ],
  "palette": {
    "ref": "digitalocean@1.0.0",
    "swatches": [
      {
        "id": "do-blue",
        "name": "DigitalOcean Blue",
        "value": "#0080FF",
        "description": "The DigitalOcean signature blue — the fill of the waving- ocean mark and the principal CTA color across digitalocean.com.\n",
        "aliases": []
      },
      {
        "id": "do-blue-dark",
        "name": "DigitalOcean Blue Dark",
        "value": "#0061C2",
        "description": "Pressed/active state for the primary CTA.",
        "aliases": []
      },
      {
        "id": "do-blue-light",
        "name": "DigitalOcean Blue Light",
        "value": "#3FA1FF",
        "description": "Soft accent used on illustrations and on dark surfaces.",
        "aliases": []
      },
      {
        "id": "do-navy",
        "name": "DigitalOcean Navy",
        "value": "#031B4E",
        "description": "Dark-mode canvas — the navy used on digitalocean.com dark-theme hero compositions.\n",
        "aliases": []
      },
      {
        "id": "do-navy-deep",
        "name": "DigitalOcean Navy Deep",
        "value": "#020E2A",
        "description": "Darkest navy used as the page-level dark canvas.",
        "aliases": []
      },
      {
        "id": "do-ink",
        "name": "DigitalOcean Ink",
        "value": "#031B4E",
        "description": "Primary text on light surfaces — the same hex as the dark canvas, used as deep ink.",
        "aliases": []
      },
      {
        "id": "do-gray",
        "name": "DigitalOcean Gray",
        "value": "#646F87",
        "description": "Secondary text and metadata.",
        "aliases": []
      },
      {
        "id": "do-gray-light",
        "name": "DigitalOcean Gray Light",
        "value": "#8B95A8",
        "description": "Tertiary text and disabled UI.",
        "aliases": []
      },
      {
        "id": "do-surface",
        "name": "DigitalOcean Surface",
        "value": "#F4F6F8",
        "description": "Quiet surface — card backgrounds on digitalocean.com.",
        "aliases": []
      },
      {
        "id": "do-border",
        "name": "DigitalOcean Border",
        "value": "#DDE3EB",
        "description": "Hairline borders and dividers.",
        "aliases": []
      },
      {
        "id": "do-white",
        "name": "DigitalOcean White",
        "value": "#FFFFFF",
        "description": "Primary canvas on light surfaces.",
        "aliases": []
      },
      {
        "id": "do-success",
        "name": "DigitalOcean Success",
        "value": "#1E944A",
        "description": "Confirmation / healthy-droplet state.",
        "aliases": []
      },
      {
        "id": "do-warning",
        "name": "DigitalOcean Warning",
        "value": "#F2A33A",
        "description": "Warning / pending state.",
        "aliases": []
      },
      {
        "id": "do-error",
        "name": "DigitalOcean Error",
        "value": "#D9534F",
        "description": "Destructive / failed-droplet state.",
        "aliases": []
      }
    ],
    "modes": {
      "light": {
        "roles": {
          "background": "do-white",
          "surface": "do-surface",
          "surface-elevated": "do-white",
          "text-primary": "do-ink",
          "text-secondary": "do-gray",
          "text-tertiary": "do-gray-light",
          "primary": "do-blue",
          "primary-hover": "do-blue-dark",
          "accent": "do-blue-light",
          "accent-hover": "do-blue",
          "warning": "do-warning",
          "warning-hover": "do-error",
          "error": "do-error",
          "success": "do-success",
          "border": "do-border"
        }
      },
      "dark": {
        "roles": {
          "background": "do-navy-deep",
          "surface": "do-navy",
          "surface-elevated": "do-blue-dark",
          "text-primary": "do-white",
          "text-secondary": "do-surface",
          "text-tertiary": "do-gray-light",
          "primary": "do-blue-light",
          "primary-hover": "do-blue",
          "accent": "do-blue",
          "accent-hover": "do-blue-light",
          "warning": "do-warning",
          "warning-hover": "do-error",
          "error": "do-error",
          "success": "do-success",
          "border": "do-blue-dark"
        }
      }
    }
  },
  "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": "do-blue",
      "on-identity": "do-white",
      "primary": "do-blue",
      "primary-hover": "do-blue-dark",
      "accent": "do-blue-light",
      "accent-hover": "do-blue",
      "background": "do-white",
      "surface": "do-surface",
      "surface-elevated": "do-white",
      "text-primary": "do-ink",
      "text-secondary": "do-gray",
      "text-tertiary": "do-gray-light",
      "chrome": "do-navy",
      "chrome-deep": "do-navy-deep",
      "mark": "do-blue"
    },
    "typography": {
      "display": "heading",
      "prose": "body",
      "code": "mono"
    }
  },
  "assets": [],
  "rules": [
    {
      "type": "colorChoice",
      "target": "logo.wave.fill",
      "severity": "error",
      "rationale": "The DigitalOcean waving-ocean mark renders in DigitalOcean Blue (#0080FF) or reversed white. The pressed-state dark blue, the illustration light blue, and the chrome navy are interactive-state and canvas tokens — none are valid mark fills.\n",
      "allowed": [
        "do-blue",
        "do-white"
      ],
      "forbidden": [
        "do-blue-dark",
        "do-blue-light",
        "do-navy"
      ]
    },
    {
      "type": "forbiddenTreatment",
      "target": "logo",
      "severity": "error",
      "rationale": "DigitalOcean's brand guidelines explicitly prohibit altering the proportions, color, or orientation of the waving-ocean mark. The wave must not be detached from the DigitalOcean wordmark on shared lockups, and gradient fills are not part of the published brand system.\n",
      "treatments": [
        "stretched",
        "rotated",
        "recolored",
        "drop-shadow",
        "on-busy-photo",
        "wave-detached-from-wordmark",
        "gradient-fill"
      ]
    },
    {
      "type": "contrastRatio",
      "target": "text-primary",
      "severity": "error",
      "rationale": "DigitalOcean Ink (#031B4E) on DigitalOcean White gives ~15:1 — well above WCAG 2.1 Level AA. The rule encodes the floor for any new foreground/background pairing on digitalocean.com.\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "contrastRatio",
      "target": "roles.colors.primary",
      "severity": "error",
      "rationale": "DigitalOcean Blue (#0080FF) on DigitalOcean White sits around 4.3:1 — it clears AA for large interactive text and approaches AA for body. The rule enforces the AA-large floor for CTA legibility on the marketing site and the control panel.\n",
      "against": "background",
      "minRatio": 3,
      "standard": "WCAG-AA-large"
    },
    {
      "type": "compositionConstraint",
      "target": "roles.colors.primary",
      "severity": "recommendation",
      "rationale": "DigitalOcean Blue pairs cleanly against the white canvas and the navy chrome. Pairing the brand blue directly with the warning amber or error red on the same surface creates a status-color conflict that competes with the brand voice.\n",
      "pairsWith": [
        "do-white",
        "do-navy",
        "do-surface"
      ],
      "doesNotPairWith": [
        "do-warning",
        "do-error"
      ]
    },
    {
      "type": "accessibilityRequirement",
      "target": "*",
      "severity": "error",
      "rationale": "WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. The DigitalOcean Community tutorials and the control-panel chrome both target AA as the floor for developer-documentation legibility.\n",
      "standard": "WCAG-AA",
      "criterion": "1.4.3"
    },
    {
      "type": "fontPairing",
      "target": "typography.heading",
      "severity": "recommendation",
      "rationale": "DigitalOcean's marketing surfaces use Inter for both heading and body. Keep headings at least 1.5× body to preserve hierarchy when one family does both jobs.\n",
      "requires": "body",
      "minSizeRatio": 1.5
    }
  ]
}