Neon Boneyard to Oxford by Night color palette

E3CDFFNeon Boneyard AD9E35Martian 3771B3Campanula 524400Alligator Gladiator 051C2FOxford by Night

About this palette

Neon Boneyard to Oxford by Night is a 5-color cool, vintage palette: #E3CDFF (Neon Boneyard), #AD9E35 (Martian), #3771B3 (Campanula), #524400 (Alligator Gladiator), #051C2F (Oxford by Night). It mixes purple, yellow, blue, brown tones and feels cool overall. The strongest text pairing is #E3CDFF on #051C2F with a contrast ratio of 11.90:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Neon Boneyard	rgb(227, 205, 255)	hsl(266, 100%, 90%)
Martian	rgb(173, 158, 53)	hsl(52, 53%, 44%)
Campanula	rgb(55, 113, 179)	hsl(212, 53%, 46%)
Alligator Gladiator	rgb(82, 68, 0)	hsl(50, 100%, 16%)
Oxford by Night	rgb(5, 28, 47)	hsl(207, 81%, 10%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa11.90:1 Very good#E3CDFF on #051C2F
Aa11.90:1 Very good#051C2F on #E3CDFF
Aa6.61:1 Good#E3CDFF on #524400
Aa6.61:1 Good#524400 on #E3CDFF
Aa6.36:1 Good#AD9E35 on #051C2F
Aa6.36:1 Good#051C2F on #AD9E35
Aa3.53:1 Poor#AD9E35 on #524400
Aa3.53:1 Poor#524400 on #AD9E35

Color blindness preview

CSS variables

/* Neon Boneyard to Oxford by Night — https://swatchly.xyz/palette/e3cdff-ad9e35-3771b3-524400-051c2f */
:root {
  --neon-boneyard: #e3cdff;
  --martian: #ad9e35;
  --campanula: #3771b3;
  --alligator-gladiator: #524400;
  --oxford-by-night: #051c2f;
}

Tailwind CSS v4

/* Neon Boneyard to Oxford by Night — https://swatchly.xyz/palette/e3cdff-ad9e35-3771b3-524400-051c2f */
@theme {
  --color-neon-boneyard: #e3cdff;
  --color-neon-boneyard-50: #f8f3ff;
  --color-neon-boneyard-100: #f1e7ff;
  --color-neon-boneyard-200: #e3cdff;
  --color-neon-boneyard-300: #cab8e2;
  --color-neon-boneyard-400: #ac98c5;
  --color-neon-boneyard-500: #907caa;
  --color-neon-boneyard-600: #75628d;
  --color-neon-boneyard-700: #5e4c73;
  --color-neon-boneyard-800: #4a3a5c;
  --color-neon-boneyard-900: #392c49;
  --color-neon-boneyard-950: #241a2f;
  --color-martian: #ad9e35;
  --color-martian-50: #fdf5c0;
  --color-martian-100: #f3ebad;
  --color-martian-200: #e1d68d;
  --color-martian-300: #cbbf69;
  --color-martian-400: #ad9e35;
  --color-martian-500: #92830a;
  --color-martian-600: #766a00;
  --color-martian-700: #5e5400;
  --color-martian-800: #4a4200;
  --color-martian-900: #3a3300;
  --color-martian-950: #252000;
  --color-campanula: #3771b3;
  --color-campanula-50: #eff6ff;
  --color-campanula-100: #dfedff;
  --color-campanula-200: #bfdcff;
  --color-campanula-300: #98c7ff;
  --color-campanula-400: #6fa7ea;
  --color-campanula-500: #528cd0;
  --color-campanula-600: #3771b3;
  --color-campanula-700: #235995;
  --color-campanula-800: #144579;
  --color-campanula-900: #0a3561;
  --color-campanula-950: #032040;
  --color-alligator-gladiator: #524400;
  --color-alligator-gladiator-50: #fef6d5;
  --color-alligator-gladiator-100: #f5ecc7;
  --color-alligator-gladiator-200: #e3d8ac;
  --color-alligator-gladiator-300: #cec28f;
  --color-alligator-gladiator-400: #b1a36a;
  --color-alligator-gladiator-500: #96874d;
  --color-alligator-gladiator-600: #7b6d34;
  --color-alligator-gladiator-700: #645721;
  --color-alligator-gladiator-800: #524400;
  --color-alligator-gladiator-900: #3e3409;
  --color-alligator-gladiator-950: #282003;
  --color-oxford-by-night: #051c2f;
  --color-oxford-by-night-50: #edf6ff;
  --color-oxford-by-night-100: #dceefe;
  --color-oxford-by-night-200: #c5daee;
  --color-oxford-by-night-300: #acc4da;
  --color-oxford-by-night-400: #8ba5bd;
  --color-oxford-by-night-500: #6e88a0;
  --color-oxford-by-night-600: #546d83;
  --color-oxford-by-night-700: #3f5569;
  --color-oxford-by-night-800: #2e4152;
  --color-oxford-by-night-900: #20303f;
  --color-oxford-by-night-950: #051c2f;
}