@radix-ui/colors/purple.css

[](https://radix-ui.com/colors)

:root, .light, .light-theme {
  --purple-1: #fefcfe;
  --purple-2: #fbf7fe;
  --purple-3: #f7edfe;
  --purple-4: #f2e2fc;
  --purple-5: #ead5f9;
  --purple-6: #e0c4f4;
  --purple-7: #d1afec;
  --purple-8: #be93e4;
  --purple-9: #8e4ec6;
  --purple-10: #8347b9;
  --purple-11: #8145b5;
  --purple-12: #402060;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    :root, .light, .light-theme {
      --purple-1: color(display-p3 0.995 0.988 0.996);
      --purple-2: color(display-p3 0.983 0.971 0.993);
      --purple-3: color(display-p3 0.963 0.931 0.989);
      --purple-4: color(display-p3 0.937 0.888 0.981);
      --purple-5: color(display-p3 0.904 0.837 0.966);
      --purple-6: color(display-p3 0.86 0.774 0.942);
      --purple-7: color(display-p3 0.799 0.69 0.91);
      --purple-8: color(display-p3 0.719 0.583 0.874);
      --purple-9: color(display-p3 0.523 0.318 0.751);
      --purple-10: color(display-p3 0.483 0.289 0.7);
      --purple-11: color(display-p3 0.473 0.281 0.687);
      --purple-12: color(display-p3 0.234 0.132 0.363);
    }
  }
}