Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: Use color values currently listed in ant-design docs for gray colors #82

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

fix: Use color values currently listed in ant-design docs for gray colors #82

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
45ee68d
Align gray colors with [email protected] palettes
tonywu6 Jan 19, 2022
8188b0c
Merge branch 'master' of https://github.com/tonywu6/ant-design-colors…
tonywu6 Jan 19, 2022
9542324
Use lighten() directly instead of using alpha
tonywu6 Jan 19, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 11 additions & 2 deletions src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import tinycolor from '@ctrl/tinycolor';
import generate from './generate';

export interface PalettesProps {
[key: string]: string[] & { primary?: string };
[key: string]: readonly string[] & { primary?: string };
}

const presetPrimaryColors: {
Expand All @@ -19,7 +20,6 @@ const presetPrimaryColors: {
geekblue: '#2F54EB',
purple: '#722ED1',
magenta: '#EB2F96',
grey: '#666666',
};

const presetPalettes: PalettesProps = {};
Expand All @@ -37,6 +37,15 @@ Object.keys(presetPrimaryColors).forEach((key): void => {
presetDarkPalettes[key].primary = presetDarkPalettes[key][5];
});

// Per [email protected] neutral colors use a separate pattern
const black = tinycolor('black');
const grayscaleGradient: number[] = [100, 98, 96, 94, 85, 75, 55, 35, 26.3, 15, 12, 8, 0];

const grayColors = grayscaleGradient.map((brightness) => `#${black.lighten(brightness).toHex()}`);

presetPalettes.grey = presetDarkPalettes.grey = grayColors;
presetDarkPalettes.grey.primary = presetDarkPalettes.grey.primary = '#BFBFBF';

const red = presetPalettes.red;
const volcano = presetPalettes.volcano;
const gold = presetPalettes.gold;
Expand Down