diff --git a/src/__snapshots__/index.spec.ts.snap b/src/__snapshots__/index.spec.ts.snap index 4d6d2a2..aea79df 100644 --- a/src/__snapshots__/index.spec.ts.snap +++ b/src/__snapshots__/index.spec.ts.snap @@ -26,60 +26,60 @@ Object { "untilMega": "(max-width: 767px)", }, "colors": Object { - "b100": "#EDF4FC", + "b100": "#F0F6FF", "b200": "#DAEAFF", "b300": "#AFD0FE", "b400": "#7FB5FF", - "b500": "#3388FF", - "b700": "#1760CE", - "b900": "#003C8B", - "black": "#0F131A", - "bodyBg": "#FAFBFC", - "bodyColor": "#0F131A", - "danger": "#DB4D4D", + "b500": "#3063E9", + "b700": "#234BC3", + "b900": "#1A368E", + "black": "#000", + "bodyBg": "#F5F5F5", + "bodyColor": "#000", + "danger": "#D23F47", "g100": "#E4EABB", "g200": "#D4DB8F", "g300": "#BED630", "g500": "#8CC13F", "g700": "#47995A", "g900": "#356560", - "n100": "#FAFBFC", - "n200": "#EEF0F2", - "n300": "#D8DDE1", - "n500": "#9DA7B1", - "n700": "#5C656F", - "n800": "#323E49", - "n900": "#212933", + "n100": "#F5F5F5", + "n200": "#E6E6E6", + "n300": "#CCC", + "n500": "#999", + "n700": "#666", + "n800": "#333", + "n900": "#1A1A1A", "o100": "#EFD0BB", "o200": "#F7B97C", - "o300": "#F7941D", + "o300": "#ED7000", "o500": "#CE6C0B", "o700": "#8E4503", "o900": "#66391B", "overlay": "rgba(12, 15, 20, 0.21)", - "p100": "#EDF4FC", + "p100": "#F0F6FF", "p200": "#DAEAFF", "p300": "#AFD0FE", "p400": "#7FB5FF", - "p500": "#3388FF", - "p700": "#1760CE", - "p900": "#003C8B", + "p500": "#3063E9", + "p700": "#234BC3", + "p900": "#1A368E", "r100": "#F4CBCB", "r200": "#EDA2A2", "r300": "#EA7A7A", - "r500": "#DB4D4D", - "r700": "#B22828", - "r900": "#7F1818", + "r500": "#D23F47", + "r700": "#B22426", + "r900": "#941618", "shadow": "rgba(12, 15, 20, 0.07)", - "success": "#47995A", + "success": "#138849", "v100": "#E9CFF2", "v200": "#D7A9DC", "v300": "#C781C9", - "v500": "#B54DB3", + "v500": "#CA58FF", "v700": "#8928A2", "v900": "#5F1D6B", - "warning": "#D8A413", - "white": "#FFFFFF", + "warning": "#F5C625", + "white": "#FFF", "y100": "#F2E9C7", "y200": "#EDDD8E", "y300": "#F6CC1B", diff --git a/src/themes/light.ts b/src/themes/light.ts index 537e3ec..459ac0f 100644 --- a/src/themes/light.ts +++ b/src/themes/light.ts @@ -17,29 +17,29 @@ import { Colors } from '../types'; export const type = 'light'; -const white = '#FFFFFF'; -const black = '#0F131A'; +const white = '#FFF'; +const black = '#000'; // NOTE: The neutral color names & values don't match up with what's in Figma. // Fixing this would be a big breaking change, so we're leaving it as is. const neutrals = { - n100: '#FAFBFC', - n200: '#EEF0F2', - n300: '#D8DDE1', - n500: '#9DA7B1', // n400 in Figma - n700: '#5C656F', // n500 in Figma - n800: '#323E49', // n700 in Figma - n900: '#212933', + n100: '#F5F5F5', + n200: '#E6E6E6', + n300: '#CCC', + n500: '#999', + n700: '#666', + n800: '#333', + n900: '#1A1A1A', }; const blues = { - b100: '#EDF4FC', + b100: '#F0F6FF', b200: '#DAEAFF', b300: '#AFD0FE', b400: '#7FB5FF', - b500: '#3388FF', - b700: '#1760CE', - b900: '#003C8B', + b500: '#3063E9', + b700: '#234BC3', + b900: '#1A368E', }; const greens = { @@ -55,7 +55,7 @@ const violets = { v100: '#E9CFF2', v200: '#D7A9DC', v300: '#C781C9', - v500: '#B54DB3', + v500: '#CA58FF', v700: '#8928A2', v900: '#5F1D6B', }; @@ -63,7 +63,7 @@ const violets = { const oranges = { o100: '#EFD0BB', o200: '#F7B97C', - o300: '#F7941D', + o300: '#ED7000', o500: '#CE6C0B', o700: '#8E4503', o900: '#66391B', @@ -82,9 +82,9 @@ const reds = { r100: '#F4CBCB', r200: '#EDA2A2', r300: '#EA7A7A', - r500: '#DB4D4D', - r700: '#B22828', - r900: '#7F1818', + r500: '#D23F47', + r700: '#B22426', + r900: '#941618', }; const primary = { @@ -102,9 +102,9 @@ const misc = { overlay: 'rgba(12, 15, 20, 0.21)', bodyBg: neutrals.n100, bodyColor: black, - danger: reds.r500, - success: greens.g700, - warning: yellows.y500, + danger: '#D23F47', + success: '#138849', + warning: '#F5C625', }; export const colors: Colors = {