themeConfig.ts 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. import { generate } from '@ant-design/colors';
  2. // export const primaryColor = '#1890FF'; // 335189
  3. export const primaryColor = '#1580cc'; // 335189
  4. // export const darkMode = 'light';
  5. export const darkMode = 'vent1';
  6. type Fn = (...arg: any) => any;
  7. type GenerateTheme = 'default' | 'dark' | 'vent1';
  8. export interface GenerateColorsParams {
  9. mixLighten: Fn;
  10. mixDarken: Fn;
  11. tinycolor: any;
  12. color?: string;
  13. }
  14. export function generateAntColors(color: string, theme: GenerateTheme = 'default') {
  15. return generate(color, {
  16. theme,
  17. });
  18. }
  19. export function getThemeColors(color?: string) {
  20. const tc = color || primaryColor;
  21. const lightColors = generateAntColors(tc);
  22. const primary = lightColors[5];
  23. const modeColors = generateAntColors(primary, 'dark');
  24. return [...lightColors, ...modeColors];
  25. }
  26. export function generateColors({ color = primaryColor, mixLighten, mixDarken, tinycolor }: GenerateColorsParams) {
  27. const arr = new Array(19).fill(0);
  28. const lightens = arr.map((_t, i) => {
  29. return mixLighten(color, i / 5);
  30. });
  31. const darkens = arr.map((_t, i) => {
  32. return mixDarken(color, i / 5);
  33. });
  34. const alphaColors = arr.map((_t, i) => {
  35. return tinycolor(color)
  36. .setAlpha(i / 20)
  37. .toRgbString();
  38. });
  39. const shortAlphaColors = alphaColors.map((item) => item.replace(/\s/g, '').replace(/0\./g, '.'));
  40. const tinycolorLightens = arr
  41. .map((_t, i) => {
  42. return tinycolor(color)
  43. .lighten(i * 5)
  44. .toHexString();
  45. })
  46. .filter((item) => item !== '#ffffff');
  47. const tinycolorDarkens = arr
  48. .map((_t, i) => {
  49. return tinycolor(color)
  50. .darken(i * 5)
  51. .toHexString();
  52. })
  53. .filter((item) => item !== '#000000');
  54. return [...lightens, ...darkens, ...alphaColors, ...shortAlphaColors, ...tinycolorDarkens, ...tinycolorLightens].filter(
  55. (item) => !item.includes('-')
  56. );
  57. }