:root[data-theme='light'] {
	--sl-color-accent-low: hsl(109, 58%, 62%);
	--sl-color-accent: hsl(109, 58%, 40%);
	--sl-color-accent-high: hsl(109, 58%, 30%);
	--sl-color-white: #4c4f69;
	--sl-color-gray-1: #5c5f77;
	--sl-color-gray-2: #6c6f85;
	--sl-color-gray-3: #7c7f93;
	--sl-color-gray-4: #bcc0cc;
	--sl-color-gray-5: #ccd0da;
	--sl-color-gray-6: #e6e9ef;
	--sl-color-gray-7: #dce0e8;
	--sl-color-black: #eff1f5;

  --sl-hue-orange: 22;
	--sl-color-orange-low: hsl(22, 69%, 87%);
	--sl-color-orange: hsl(22, 99%, 42%);
	--sl-color-orange-high: hsl(22, 99%, 52%);
	--sl-hue-green: 109;
	--sl-color-green-low: hsl(109, 27%, 75%);
	--sl-color-green: hsl(109, 58%, 30%);
	--sl-color-green-high: hsl(109, 58%, 40%);
	--sl-hue-blue: 220;
	--sl-color-blue-low: hsl(220, 61%, 89%);
	--sl-color-blue: hsl(220, 91%, 44%);
	--sl-color-blue-high: hsl(220, 91%, 54%);
	--sl-hue-purple: 266;
	--sl-color-purple-low: hsl(266, 55%, 88%);
	--sl-color-purple: hsl(266, 85%, 48%);
	--sl-color-purple-high: hsl(266, 85%, 58%);
	--sl-hue-red: 347;
	--sl-color-red-low: hsl(347, 56%, 84%);
	--sl-color-red: hsl(347, 87%, 34%);
	--sl-color-red-high: hsl(347, 87%, 44%);

  color-scheme: light;
}