Skip to content

Commit

Permalink
Add the latest FIG colors to React Native color palette
Browse files Browse the repository at this point in the history
Reviewed By: weicool

Differential Revision: D2965103

fb-gh-sync-id: 104d524af0547895ff976bcf4d68f199f1b6537b
shipit-source-id: 104d524af0547895ff976bcf4d68f199f1b6537b
  • Loading branch information
fryn authored and facebook-github-bot-3 committed Feb 24, 2016
1 parent 7176c52 commit 9d1abf0
Showing 1 changed file with 50 additions and 1 deletion.
51 changes: 50 additions & 1 deletion Libraries/Utilities/CSSVarConfig.js
Expand Up @@ -8,6 +8,56 @@
// this a partial list of the constants in CSSConstants:: from PHP that are applicable to mobile

module.exports = {
// FIG UI Core
'fbui-blue': '#4267b2',
'fbui-accent': '#4080ff',
'fbui-highlight': '#ecf3ff',
'fbui-green': '#4bc832',
'fbui-red': '#fa3e3e',
'fbui-white': '#ffffff',
'fbui-black': '#000000',

// FIG UI Light
'fbui-light-02': '#f6f7f9',
'fbui-light-05': '#e9ebee',
'fbui-light-10': '#dddfe2',
'fbui-light-15': '#ced0d4',
'fbui-light-20': '#bec2c9',
'fbui-light-30': '#90949c',
'fbui-light-50': '#4b4f56',
'fbui-light-80': '#1d2129',

// FIG UI Alpha
'fbui-white-alpha-15': 'rgba(255, 255, 255, .15)',
'fbui-white-alpha-30': 'rgba(255, 255, 255, .3)',
'fbui-white-alpha-40': 'rgba(255, 255, 255, .4)',
'fbui-white-alpha-50': 'rgba(255, 255, 255, .5)',
'fbui-white-alpha-80': 'rgba(255, 255, 255, .8)',
'fbui-black-alpha-15': 'rgba(0, 0, 0, .15)',
'fbui-black-alpha-30': 'rgba(0, 0, 0, .3)',
'fbui-black-alpha-40': 'rgba(0, 0, 0, .4)',
'fbui-black-alpha-50': 'rgba(0, 0, 0, .5)',
'fbui-black-alpha-80': 'rgba(0, 0, 0, .8)',

// FB UI Dark
'fbui-dark-20': '#cccccc',
'fbui-dark-50': '#7f7f7f',
'fbui-dark-70': '#4c4c4c',
'fbui-dark-80': '#333333',
'fbui-dark-85': '#262626',
'fbui-dark-90': '#191919',
'fbui-dark-95': '#0d0d0d',

// FIG UI Core - Blue variants
'fbui-blue-dark-1': '#29487d',
'fbui-blue-dark-2': '#20375f',
'fbui-blue-dark-3': '#162643',
'fbui-blue-tint-15': '#577fbc',
'fbui-blue-tint-30': '#7596c8',
'fbui-blue-tint-50': '#9cb4d8',
'fbui-blue-tint-70': '#c4d2e7',
'fbui-blue-tint-90': '#ecf0f7',

'fbui-accent-blue': '#5890ff',
'fbui-blue-90': '#4e69a2',
'fbui-blue-80': '#627aad',
Expand Down Expand Up @@ -53,7 +103,6 @@ module.exports = {
'fbui-gray-10': '#e5e5e5',
'fbui-gray-5': '#f2f2f2',
'fbui-gray-2': '#fafafa',
'fbui-red': '#da2929',
'fbui-error': '#ce0d24',
'x-mobile-dark-text': '#4e5665',
'x-mobile-medium-text': '#6a7180',
Expand Down

1 comment on commit 9d1abf0

@geirman
Copy link
Contributor

@geirman geirman commented on 9d1abf0 Mar 9, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What's a FIG color and how/where are these useful?

Please sign in to comment.