skip to main content

skip to navigation sidebar

skip to context sidebar

created:12/30/2020

updated:12/30/2020

loc

99

comments

10%

OPatternColor

Color item displaying as a table row, with color block, sass name, and hex, RGB, and CMYK color values. Design inspired by OPattern.

Color	Variable	Hex	RGB	CMYK
	`$primary-color`	#107CB2	16, 124, 178	91, 30, 0, 30
	`$primary-color-light`	30% of $primary-color
	`$alert-color`	#D8400F	216, 64, 15	0, 70, 93, 15
	`$alert-color-light`	30% of $alert-color
	`$weather-color`	#990099	153, 0, 153	0, 100, 0, 40

	id	description
	avoid-inline-spacing	Ensure that text spacing set through style attributes can be adjusted with custom stylesheets...
	color-contrast	Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds...
	empty-table-header	Ensures table headers have discernible text...
	table-duplicate-name	Ensure the <caption> element does not contain the same text as the summary attribute...
	td-headers-attr	Ensure that each cell in a table that uses the headers attribute refers only to other cells in that table...
	th-has-data-cells	Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describe...

Viewport

Color	Variable	Hex	RGB	CMYK
	`$primary-color`	#107CB2	16, 124, 178	91, 30, 0, 30
	`$primary-color-light`	30% of $primary-color
	`$alert-color`	#D8400F	216, 64, 15	0, 70, 93, 15
	`$alert-color-light`	30% of $alert-color
	`$weather-color`	#990099	153, 0, 153	0, 100, 0, 40

320px

Color	Variable	Hex	RGB	CMYK
	`$primary-color`	#107CB2	16, 124, 178	91, 30, 0, 30
	`$primary-color-light`	30% of $primary-color
	`$alert-color`	#D8400F	216, 64, 15	0, 70, 93, 15
	`$alert-color-light`	30% of $alert-color
	`$weather-color`	#990099	153, 0, 153	0, 100, 0, 40

375px

Color	Variable	Hex	RGB	CMYK
	`$primary-color`	#107CB2	16, 124, 178	91, 30, 0, 30
	`$primary-color-light`	30% of $primary-color
	`$alert-color`	#D8400F	216, 64, 15	0, 70, 93, 15
	`$alert-color-light`	30% of $alert-color
	`$weather-color`	#990099	153, 0, 153	0, 100, 0, 40

768px

Color	Variable	Hex	RGB	CMYK
	`$primary-color`	#107CB2	16, 124, 178	91, 30, 0, 30
	`$primary-color-light`	30% of $primary-color
	`$alert-color`	#D8400F	216, 64, 15	0, 70, 93, 15
	`$alert-color-light`	30% of $alert-color
	`$weather-color`	#990099	153, 0, 153	0, 100, 0, 40

1024px

Design Tokens/Colors/MorningstarColor

Design Tokens/Colors/PajamasColor