@ColorPalette-variables:
	color-white,
	color-black,
	color-primary,
	color-primaryMedium,
	color-primaryLight,
	color-textColor,
	color-disabledText,
	color-linkColor,
	color-linkColorHover,
	color-lightGray,
	color-gray,
	color-mediumGray,
	color-darkGray,
	color-borderColor,
	color-backgroundColor,
	color-pageBackgroundColor,
	featured-color-default,
	featured-color-primary,
	featured-color-success,
	featured-color-info,
	featured-color-warning,
	featured-color-danger,
	featured-color-default-borderColor,
	featured-color-default-backgroundColor,
	featured-color-default-gradientStartColor,
	featured-color-default-gradientEndColor,
	featured-color-primary-backgroundColorLight,
	featured-color-primary-colorHover,
	featured-color-primary-borderColor,
	featured-color-primary-borderColorLite,
	featured-color-primary-backgroundColor,
	featured-color-primary-gradientStartColor,
	featured-color-primary-gradientEndColor,
	featured-color-success-backgroundColorLight,
	featured-color-success-borderColor,
	featured-color-success-borderColorLite,
	featured-color-success-backgroundColor,
	featured-color-success-gradientStartColor,
	featured-color-success-gradientEndColor,
	featured-color-success-colorHover,
	featured-color-info-backgroundColorLight,
	featured-color-info-borderColor,
	featured-color-info-borderColorLite,
	featured-color-info-backgroundColor,
	featured-color-info-gradientStartColor,
	featured-color-info-gradientEndColor,
	featured-color-info-colorHover,
	featured-color-warning-backgroundColorLight,
	featured-color-warning-borderColor,
	featured-color-warning-borderColorLite,
	featured-color-warning-backgroundColor,
	featured-color-warning-gradientStartColor,
	featured-color-warning-gradientEndColor,
	featured-color-warning-colorHover,
	featured-color-danger-backgroundColorLight,
	featured-color-danger-borderColor,
	featured-color-danger-borderColorLite,
	featured-color-danger-backgroundColor,
	featured-color-danger-gradientStartColor,
	featured-color-danger-gradientEndColor,
	featured-color-danger-colorHover,
	color-chart-0-lightest,
	color-chart-0-light,
	color-chart-0,
	color-chart-0-dark,
	color-chart-0-darkest,
	color-chart-1-lightest,
	color-chart-1-light,
	color-chart-1,
	color-chart-1-dark,
	color-chart-1-darkest,
	color-chart-2-lightest,
	color-chart-2-light,
	color-chart-2,
	color-chart-2-dark,
	color-chart-2-darkest,
	color-chart-3-lightest,
	color-chart-3-light,
	color-chart-3,
	color-chart-3-dark,
	color-chart-3-darkest,
	color-chart-4-lightest,
	color-chart-4-light,
	color-chart-4,
	color-chart-4-dark,
	color-chart-4-darkest,
	color-chart-5-lightest,
	color-chart-5-light,
	color-chart-5,
	color-chart-5-dark,
	color-chart-5-darkest,
	color-chart-good,
	color-chart-good-lightest,
	color-chart-good-light,
	color-chart-good-dark,
	color-chart-good-darkest,
	color-chart-bad,
	color-chart-bad-lightest,
	color-chart-bad-light,
	color-chart-bad-dark,
	color-chart-bad-darkest,
	color-chart-neutral;

.ColorPalette-loop(@i: length(@ColorPalette-variables)) when (@i > 0) {
	@name: extract(@ColorPalette-variables, @i);

	&-@{name} {
		background-color: @@name;
		color: contrast(@@name);
	}

	// Recurse
	.ColorPalette-loop(@i - 1);
}

.ColorPalette {
	// Invoke the loop
	.ColorPalette-loop();

	padding: 15px;

	&-item {
		display: flex;
		justify-content: space-between;
		padding: @size-standard;
		font-size: @size-font;
		font-family: monospace;
	}

	&-hex-string {
		font-style: italic;
		font-size: 0.8em;
		margin: 0;
	}
}