Less Design tokens

Do more with Less


_design-tokens.less:


// Do not edit directly
// Generated on Mon, 19 Apr 2021 15:39:33 GMT

@gg-color-black: #000000;
@gg-color-white: #FFFFFF;
@gg-color-light-pink: #EB5F8E;
@gg-color-light-green: #72B72A;
@gg-color-light-blue: #35ADCE;
@gg-color-yellow: #FCC31E;
@gg-color-red: #d60000;
@gg-color-dark-green: #007349;
@gg-color-dark-blue: #00528A;
@gg-color-orange: #EA5B25;
@gg-color-graphite: #2F2E31;
@gg-color-dove-grey: #666666;
@gg-color-alto: #D0D0D0;
@gg-color-wild-sand: #F5F5F5;
@gg-color-gallery: #ECECEC;
@gg-color-pastel-yellow: #FEF3D2;
@gg-color-pastel-green: #E3F1D4;
@gg-color-pastel-red: #FBE6E6;
@gg-color-pastel-blue: #D7EFF5;
@gg-breakpoint-tiny: 320px;
@gg-breakpoint-small: 360px;
@gg-breakpoint-medium: 768px;
@gg-breakpoint-large: 992px;
@gg-grid-unit: 8px;
@gg-icon-small: 16px;
@gg-icon-medium: 24px;
@gg-icon-large: 48px;
@gg-icon-huge: 72px;
@gg-icon-gargantuan: 120px;
@gg-icon-colossal: 192px;
@gg-image-tiny: 72px;
@gg-image-small: 120px;
@gg-image-medium: 192px;
@gg-image-large: 312px;
@gg-image-huge: 504px;
@gg-layout-min-width: 320px;
@gg-layout-max-width: 1140px;
@gg-layout-header-height: 56px;
@gg-spacer-fine: 4px;
@gg-spacer-tiny: 8px;
@gg-spacer-small: 16px;
@gg-spacer-medium: 24px;
@gg-spacer-large: 48px;
@gg-spacer-huge: 72px;
@gg-text-megaphone-font-size: 40px;
@gg-text-megaphone-line-height: 48px;
@gg-text-megaphone-font-weight: 700;
@gg-text-megaphone-medium-breakpoint-font-size: 82px;
@gg-text-megaphone-medium-breakpoint-line-height: 88px;
@gg-text-megaphone-medium-breakpoint-letter-spacing: -.02em;
@gg-text-shout-font-size: 32px;
@gg-text-shout-line-height: 40px;
@gg-text-shout-font-weight: 700;
@gg-text-shout-medium-breakpoint-font-size: 54px;
@gg-text-shout-medium-breakpoint-line-height: 64px;
@gg-text-louder-font-size: 24px;
@gg-text-louder-line-height: 32px;
@gg-text-louder-font-weight: 700;
@gg-text-louder-medium-breakpoint-font-size: 36px;
@gg-text-louder-medium-breakpoint-line-height: 48px;
@gg-text-loud-font-size: 20px;
@gg-text-loud-line-height: 24px;
@gg-text-loud-font-weight: 500;
@gg-text-loud-medium-breakpoint-font-size: 24px;
@gg-text-loud-medium-breakpoint-line-height: 32px;
@gg-text-loud-bold-font-size: 20px;
@gg-text-loud-bold-line-height: 24px;
@gg-text-loud-bold-font-weight: 700;
@gg-text-loud-bold-medium-breakpoint-font-size: 24px;
@gg-text-loud-bold-medium-breakpoint-line-height: 32px;
@gg-text-speak-up-font-size: 16px;
@gg-text-speak-up-font-weight: 700;
@gg-text-speak-up-line-height: 24px;
@gg-text-speak-font-size: 16px;
@gg-text-speak-font-weight: 400;
@gg-text-speak-line-height: 24px;
@gg-text-murmur-font-size: 14px;
@gg-text-murmur-letter-spacing: .02em;
@gg-text-murmur-font-weight: 400;
@gg-text-murmur-line-height: 21px;
@gg-text-murmur-bold-font-size: 14px;
@gg-text-murmur-bold-letter-spacing: .02em;
@gg-text-murmur-bold-font-weight: 700;
@gg-text-murmur-bold-line-height: 21px;
@gg-text-whisper-loud-font-size: 12px;
@gg-text-whisper-loud-letter-spacing: .02em;
@gg-text-whisper-loud-font-weight: 700;
@gg-text-whisper-loud-line-height: 18px;
@gg-text-whisper-font-size: 12px;
@gg-text-whisper-letter-spacing: .02em;
@gg-text-whisper-font-weight: 400;
@gg-text-whisper-line-height: 18px;