@synergycodes/axiom/dist/primitives-mode-1.css

A React library for creating node-based UIs and diagram-driven applications. Perfect for React Flow users, providing ready-to-use node templates and components that work seamlessly with React Flow's ecosystem.

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --ax-colors-gray-100: #ffffff;
  --ax-colors-gray-200: #f5f5f7;
  --ax-colors-gray-300: #edeff3;
  --ax-colors-gray-400: #d5d8e0;
  --ax-colors-gray-500: #6f7480;
  --ax-colors-gray-600: #4d5059;
  --ax-colors-gray-700: #27282b;
  --ax-colors-gray-800: #151516;
  --ax-colors-gray-900: #070708;
  --ax-colors-blue-100: #eef2fd;
  --ax-colors-blue-200: #e3e8f5;
  --ax-colors-blue-300: #d0d8eb;
  --ax-colors-blue-400: #336dff;
  --ax-colors-blue-500: #2b5bd5;
  --ax-colors-blue-600: #2249ab;
  --ax-colors-green-100: #e9f7ee;
  --ax-colors-green-200: #c2edd1;
  --ax-colors-green-300: #29974e;
  --ax-colors-green-400: #007c29;
  --ax-colors-orange-100: #f7f2e9;
  --ax-colors-orange-200: #eddfc2;
  --ax-colors-orange-300: #ffaf10;
  --ax-colors-orange-400: #e59800;
  --ax-colors-red-100: #f7e9e9;
  --ax-colors-red-200: #edc2c2;
  --ax-colors-red-300: #deadad;
  --ax-colors-red-400: #962929;
  --ax-colors-red-500: #7d0000;
  --ax-colors-red-600: #670000;
  --ax-colors-gray-650: #383a40;
  --ax-colors-gray-450: #bdc1cc;
  --ax-colors-green-400-10: rgba(0, 124, 41, 0.1);
  --ax-colors-orange-400-10: rgba(229, 152, 0, 0.1);
  --ax-colors-red-400-10: rgba(150, 41, 41, 0.1);
  --ax-colors-red-400-20: rgba(150, 41, 41, 0.2);
  --ax-colors-red-400-50: rgba(150, 41, 41, 0.5);
  --ax-colors-gray-100-50: rgba(255, 255, 255, 0.5);
  --ax-colors-gray-100-30: rgba(255, 255, 255, 0.3);
  --ax-colors-gray-900-50: rgba(7, 7, 8, 0.5);
  --ax-colors-gray-900-30: rgba(7, 7, 8, 0.3);
  --ax-colors-gray-100-75: rgba(255, 255, 255, 0.75);
  --ax-colors-red-400-30: rgba(150, 41, 41, 0.3);
  --ax-colors-red-100-10: rgba(247, 233, 233, 0.1);
  --ax-colors-red-100-20: rgba(247, 233, 233, 0.2);
  --ax-colors-red-100-30: rgba(247, 233, 233, 0.3);
  --ax-colors-red-100-50: rgba(247, 233, 233, 0.5);
  --ax-colors-blue-400-10: rgba(51, 109, 255, 0.1);
  --ax-colors-blue-400-20: rgba(51, 109, 255, 0.2);
  --ax-colors-blue-400-30: rgba(51, 109, 255, 0.3);
  --ax-colors-blue-400-50: rgba(51, 109, 255, 0.5);
  --ax-colors-green-400-20: rgba(0, 124, 41, 0.2);
  --ax-colors-green-400-30: rgba(0, 124, 41, 0.3);
  --ax-colors-green-400-50: rgba(0, 124, 41, 0.5);
  --ax-colors-orange-400-20: rgba(229, 152, 0, 0.2);
  --ax-colors-orange-400-30: rgba(229, 152, 0, 0.3);
  --ax-colors-orange-400-50: rgba(229, 152, 0, 0.5);
  --ax-colors-gray-100-10: rgba(255, 255, 255, 0.1);
  --ax-colors-gray-100-20: rgba(255, 255, 255, 0.2);
  --ax-colors-gray-900-10: rgba(7, 7, 8, 0.1);
  --ax-colors-gray-900-20: rgba(7, 7, 8, 0.2);
  --ax-colors-gray-900-5: rgba(7, 7, 8, 0.05);
  --ax-colors-gray-900-75: rgba(7, 7, 8, 0.5);
  --ax-colors-gray-100-5: rgba(255, 255, 255, 0.05);
  --ax-colors-blue-350: #729aff;
  --ax-colors-acc1-50: #f0f8ff;
  --ax-colors-acc1-100: #e0f0fe;
  --ax-colors-acc1-200: #bbe2fc;
  --ax-colors-acc1-300: #5fbefa;
  --ax-colors-acc1-400: #3ab0f6;
  --ax-colors-acc1-500: #1096e7;
  --ax-colors-acc1-600: #0477c5;
  --ax-colors-acc1-700: #045fa0;
  --ax-colors-acc1-800: #085184;
  --ax-colors-acc1-900: #0d446d;
  --ax-colors-acc1-950: #092b48;
  --ax-colors-acc1-500-10: rgba(16, 150, 231, 0.1);
  --ax-colors-acc1-500-20: rgba(16, 150, 231, 0.2);
  --ax-colors-acc1-500-30: rgba(16, 150, 231, 0.3);
  --ax-colors-acc1-500-50: rgba(16, 150, 231, 0.5);
  --ax-colors-acc1-500-40: rgba(16, 150, 231, 0.4);
  --ax-colors-acc1-950-10: rgba(9, 43, 72, 0.1);
  --ax-colors-acc1-950-20: rgba(9, 43, 72, 0.2);
  --ax-colors-acc1-950-30: rgba(9, 43, 72, 0.3);
  --ax-colors-acc1-950-50: rgba(9, 43, 72, 0.5);
  --ax-colors-acc1-950-40: rgba(9, 43, 72, 0.4);
  --ax-colors-acc2-50: #fef2f2;
  --ax-colors-acc2-100: #fee3e2;
  --ax-colors-acc2-200: #fdcdcb;
  --ax-colors-acc2-300: #fa928e;
  --ax-colors-acc2-400: #f77772;
  --ax-colors-acc2-500: #ed4c46;
  --ax-colors-acc2-500-10: rgba(237, 76, 70, 0.1);
  --ax-colors-acc2-500-20: rgba(237, 76, 70, 0.2);
  --ax-colors-acc2-500-30: rgba(237, 76, 70, 0.3);
  --ax-colors-acc2-500-40: rgba(237, 76, 70, 0.4);
  --ax-colors-acc2-500-50: rgba(237, 76, 70, 0.5);
  --ax-colors-acc2-600: #da2f28;
  --ax-colors-acc2-700: #b7241e;
  --ax-colors-acc2-800: #98211c;
  --ax-colors-acc2-900: #7e221e;
  --ax-colors-acc2-950: #440d0b;
  --ax-colors-acc2-950-10: rgba(68, 13, 11, 0.1);
  --ax-colors-acc2-950-20: rgba(68, 13, 11, 0.2);
  --ax-colors-acc2-950-30: rgba(68, 13, 11, 0.3);
  --ax-colors-acc2-950-40: rgba(68, 13, 11, 0.4);
  --ax-colors-acc2-950-50: rgba(68, 13, 11, 0.5);
  --ax-colors-acc3-50: #effef7;
  --ax-colors-acc3-100: #cafde6;
  --ax-colors-acc3-200: #7efac4;
  --ax-colors-acc3-300: #57f1b1;
  --ax-colors-acc3-400: #24dd90;
  --ax-colors-acc3-500: #0bc175;
  --ax-colors-acc3-600: #069b62;
  --ax-colors-acc3-700: #0a7b52;
  --ax-colors-acc3-800: #0d6244;
  --ax-colors-acc3-900: #10513b;
  --ax-colors-acc3-950: #023121;
  --ax-colors-acc4-50: #fbf5ff;
  --ax-colors-acc4-100: #f6e9fe;
  --ax-colors-acc4-200: #eed6fe;
  --ax-colors-acc4-300: #e0b6fc;
  --ax-colors-acc4-400: #d395f9;
  --ax-colors-acc4-500: #ba5af2;
  --ax-colors-acc4-600: #a839e4;
  --ax-colors-acc4-700: #9127c9;
  --ax-colors-acc4-800: #7a25a4;
  --ax-colors-acc4-900: #641f84;
  --ax-colors-acc4-950: #450a61;
  --ax-colors-acc5-50: #fff4ed;
  --ax-colors-acc5-100: #fee7d6;
  --ax-colors-acc5-200: #fccdac;
  --ax-colors-acc5-300: #faae73;
  --ax-colors-acc5-400: #f79240;
  --ax-colors-acc5-500: #f4841b;
  --ax-colors-acc5-600: #e57711;
  --ax-colors-acc5-700: #be5310;
  --ax-colors-acc5-800: #973c15;
  --ax-colors-acc5-900: #7a2f14;
  --ax-colors-acc5-950: #421608;
  --ax-colors-acc3-500-10: rgba(11, 193, 117, 0.1);
  --ax-colors-acc3-500-20: rgba(11, 193, 117, 0.2);
  --ax-colors-acc3-500-30: rgba(11, 193, 117, 0.3);
  --ax-colors-acc3-500-50: rgba(11, 193, 117, 0.5);
  --ax-colors-acc4-500-10: rgba(186, 90, 242, 0.1);
  --ax-colors-acc4-500-20: rgba(186, 90, 242, 0.2);
  --ax-colors-acc4-500-30: rgba(186, 90, 242, 0.3);
  --ax-colors-acc4-500-50: rgba(186, 90, 242, 0.5);
  --ax-colors-acc5-500-10: rgba(244, 132, 27, 0.1);
  --ax-colors-acc5-500-20: rgba(244, 132, 27, 0.2);
  --ax-colors-acc5-500-30: rgba(244, 132, 27, 0.3);
  --ax-colors-acc5-500-50: rgba(244, 132, 27, 0.5);
  --ax-colors-acc3-500-40: rgba(11, 193, 117, 0.4);
  --ax-colors-acc4-500-40: rgba(186, 90, 242, 0.4);
  --ax-colors-acc5-500-40: rgba(244, 132, 27, 0.4);
  --ax-colors-acc6-50: #f1f2ff;
  --ax-colors-acc6-100: #dddffe;
  --ax-colors-acc6-200: #bbbefc;
  --ax-colors-acc6-300: #999efb;
  --ax-colors-acc6-400: #777df9;
  --ax-colors-acc6-500: #555df8;
  --ax-colors-acc6-600: #444ac6;
  --ax-colors-acc6-700: #333895;
  --ax-colors-acc6-800: #222563;
  --ax-colors-acc6-900: #111332;
  --ax-colors-acc6-950: #080a24;
  --ax-colors-acc7-50: #e3e3e3;
  --ax-colors-acc7-100: #cfd0d6;
  --ax-colors-acc7-200: #a0a1ad;
  --ax-colors-acc7-300: #707184;
  --ax-colors-acc7-400: #41425b;
  --ax-colors-acc7-500: #111332;
  --ax-colors-acc7-600: #0e0f28;
  --ax-colors-acc7-700: #0a0b1e;
  --ax-colors-acc7-800: #070814;
  --ax-colors-acc7-900: #03040a;
  --ax-colors-acc7-950: #010208;
  --ax-colors-acc7-100: #cfd0d6;
  --ax-colors-acc7-200: #a0a1ad;
  --ax-colors-acc7-300: #707184;
  --ax-colors-acc7-400: #41425b;
  --ax-colors-acc7-500: #111332;
  --ax-colors-acc7-600: #0e0f28;
  --ax-colors-acc7-700: #0a0b1e;
  --ax-colors-acc7-800: #070814;
  --ax-colors-acc7-900: #03040a;
  --ax-colors-acc7-950: #010208;
}