Skip to content

Instantly share code, notes, and snippets.

@felixfoertsch
Last active July 31, 2020 14:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save felixfoertsch/36922ee9a74d9bd0c0887f62cecb7041 to your computer and use it in GitHub Desktop.
Save felixfoertsch/36922ee9a74d9bd0c0887f62cecb7041 to your computer and use it in GitHub Desktop.
The official macOS colors as SCSS variables (light version)
$macOS-systemBlue: rgba(0, 122, 255, 1);
$macOS-systemBrown: rgba(162, 132, 94, 1);
$macOS-systemGray: rgba(142, 142, 147, 1);
$macOS-systemGreen: rgba(40, 205, 65, 1);
$macOS-systemIndigo: rgba(88, 86, 214, 1);
$macOS-systemOrange: rgba(255, 149, 0, 1);
$macOS-systemPink: rgba(255, 45, 85, 1);
$macOS-systemPurple: rgba(175, 82, 222, 1);
$macOS-systemRed: rgba(255, 59, 48, 1);
$macOS-systemTeal: rgba(90, 200, 250, 1);
$macOS-systemYellow: rgba(255, 204, 0, 1);
$macOS-alternateSelectedControl: rgba(0, 99, 255, 1);
$macOS-alternateSelectedControlText: rgba(255, 255, 255, 1);
$macOS-controlBackground: rgba(255, 255, 255, 1);
$macOS-controlText: rgba(0, 0, 0, 0.8);
$macOS-disabledControlText: rgba(0, 0, 0, 0.2);
$macOS-grid: rgba(204, 204, 204, 1);
$macOS-headerText: rgba(0, 0, 0, 0.8);
$macOS-highlight: rgba(255, 255, 255, 1);
$macOS-labelColor: rgba(0, 0, 0, 0.8);
$macOS-linkColor: rgba(0, 104, 218, 1);
$macOS-placeholderTextColor: rgba(0, 0, 0, 0.2);
$macOS-quaternaryLabelColor: rgba(0, 0, 0, 0.1);
$macOS-secondaryLabelColor: rgba(0, 0 ,0, 0.5);
$macOS-selectedContentBackgroundColor: rgba(0, 99, 225, 1);
$macOS-selectedControlColor: rgba(179, 215, 255, 1);
$macOS-selectedControlTextColor: rgba(0, 0, 0, 0.8);
$macOS-selectedMenuItemTextColor: rgba(255, 255, 255, 1);
$macOS-selectedTextBackgroundColor: rgba(179, 215, 255, 1);
$macOS-selectedTextColor: rgba(0, 0, 0, 1);
$macOS-separatorColor: rgba(0, 0, 0, 0.1);
$macOS-shadowColor: rgba(0, 0, 0, 1);
$macOS-tertiaryLabelColor: rgba(0, 0, 0, 0.2);
$macOS-textBackgroundColor: rgba(255, 255, 255, 1);
$macOS-textColor: rgba(0, 0, 0, 1);
$macOS-underPageBackgroundColor: rgba(150, 150, 150, 0.9);
$macOS-unemphasizedSelectedContentBackgroundColor: rgba(220, 220, 220, 1);
$macOS-unemphasizedSelectedTextBackgroundColor: rgba(220, 220, 220, 1);
$macOS-unemphasizedSelectedTextColor: rgba(0, 0, 0, 1);
$macOS-windowBackgroundColor: rgba(236, 236, 236, 1);
$macOS-windowFrameTextColor: rgba(0, 0, 0, 0.8);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment