Reorder colors to have a proper gradient (#16096)

## Before

<img width="638" height="1712" alt="CleanShot 2025-11-26 at 15 28 47@2x"
src="https://github.com/user-attachments/assets/a8ebadf7-a642-46c1-bb96-067e8b451059"
/>


## After

<img width="638" height="1712" alt="CleanShot 2025-11-26 at 15 26 15@2x"
src="https://github.com/user-attachments/assets/d276240c-4b34-4ea3-954d-2a20a94ddf60"
/>
This commit is contained in:
Raphaël Bosi
2025-11-26 15:40:45 +01:00
committed by GitHub
parent 6fcb05d9b3
commit c34f798a9c
2 changed files with 54 additions and 54 deletions
@@ -2,40 +2,40 @@ import * as RadixColors from '@radix-ui/colors';
import { GRAY_SCALE_DARK } from '@ui/theme/constants/GrayScaleDark';
export const MAIN_COLORS_DARK = {
// Grays
gray: GRAY_SCALE_DARK.gray7,
// Reds
tomato: RadixColors.tomatoDarkP3.tomato9,
red: RadixColors.redDarkP3.red9,
ruby: RadixColors.rubyDarkP3.ruby9,
crimson: RadixColors.crimsonDarkP3.crimson9,
// Pinks & Purples
pink: RadixColors.pinkDarkP3.pink9,
plum: RadixColors.plumDarkP3.plum9,
purple: RadixColors.purpleDarkP3.purple9,
violet: RadixColors.violetDarkP3.violet9,
iris: RadixColors.irisDarkP3.iris9,
// Cyans & Blues
cyan: RadixColors.cyanDarkP3.cyan9,
turquoise: RadixColors.tealDarkP3.teal9,
sky: RadixColors.skyDarkP3.sky9,
blue: RadixColors.indigoDarkP3.indigo9,
// Greens
jade: RadixColors.jadeDarkP3.jade9,
green: RadixColors.greenDarkP3.green9,
grass: RadixColors.grassDarkP3.grass9,
mint: RadixColors.mintDarkP3.mint9,
lime: RadixColors.limeDarkP3.lime9,
tomato: RadixColors.tomatoDarkP3.tomato9,
// Oranges & Yellows
bronze: RadixColors.bronzeDarkP3.bronze9,
gold: RadixColors.goldDarkP3.gold9,
brown: RadixColors.brownDarkP3.brown9,
orange: RadixColors.orangeDarkP3.orange9,
amber: RadixColors.amberDarkP3.amber9,
yellow: RadixColors.yellowDarkP3.yellow9,
// Greens
lime: RadixColors.limeDarkP3.lime9,
grass: RadixColors.grassDarkP3.grass9,
green: RadixColors.greenDarkP3.green9,
jade: RadixColors.jadeDarkP3.jade9,
mint: RadixColors.mintDarkP3.mint9,
// Cyans & Blues
turquoise: RadixColors.tealDarkP3.teal9,
cyan: RadixColors.cyanDarkP3.cyan9,
sky: RadixColors.skyDarkP3.sky9,
blue: RadixColors.indigoDarkP3.indigo9,
// Purples & Pinks
iris: RadixColors.irisDarkP3.iris9,
violet: RadixColors.violetDarkP3.violet9,
purple: RadixColors.purpleDarkP3.purple9,
plum: RadixColors.plumDarkP3.plum9,
pink: RadixColors.pinkDarkP3.pink9,
// Earth tones & Neutrals
bronze: RadixColors.bronzeDarkP3.bronze9,
gold: RadixColors.goldDarkP3.gold9,
brown: RadixColors.brownDarkP3.brown9,
gray: GRAY_SCALE_DARK.gray7,
};
@@ -2,40 +2,40 @@ import * as RadixColors from '@radix-ui/colors';
import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
export const MAIN_COLORS_LIGHT = {
// Grays
gray: GRAY_SCALE_LIGHT.gray7,
// Reds
tomato: RadixColors.tomatoP3.tomato9,
red: RadixColors.redP3.red9,
ruby: RadixColors.rubyP3.ruby9,
crimson: RadixColors.crimsonP3.crimson9,
// Pinks & Purples
pink: RadixColors.pinkP3.pink9,
plum: RadixColors.plumP3.plum9,
purple: RadixColors.purpleP3.purple9,
violet: RadixColors.violetP3.violet9,
iris: RadixColors.irisP3.iris9,
// Cyans & Blues
cyan: RadixColors.cyanP3.cyan9,
turquoise: RadixColors.tealP3.teal9,
sky: RadixColors.skyP3.sky9,
blue: RadixColors.indigoP3.indigo9,
// Greens
jade: RadixColors.jadeP3.jade9,
green: RadixColors.greenP3.green9,
grass: RadixColors.grassP3.grass9,
mint: RadixColors.mintP3.mint9,
lime: RadixColors.limeP3.lime9,
tomato: RadixColors.tomatoP3.tomato9,
// Oranges & Yellows
bronze: RadixColors.bronzeP3.bronze9,
gold: RadixColors.goldP3.gold9,
brown: RadixColors.brownP3.brown9,
orange: RadixColors.orangeP3.orange9,
amber: RadixColors.amberP3.amber9,
yellow: RadixColors.yellowP3.yellow9,
// Greens
lime: RadixColors.limeP3.lime9,
grass: RadixColors.grassP3.grass9,
green: RadixColors.greenP3.green9,
jade: RadixColors.jadeP3.jade9,
mint: RadixColors.mintP3.mint9,
// Cyans & Blues
turquoise: RadixColors.tealP3.teal9,
cyan: RadixColors.cyanP3.cyan9,
sky: RadixColors.skyP3.sky9,
blue: RadixColors.indigoP3.indigo9,
// Purples & Pinks
iris: RadixColors.irisP3.iris9,
violet: RadixColors.violetP3.violet9,
purple: RadixColors.purpleP3.purple9,
plum: RadixColors.plumP3.plum9,
pink: RadixColors.pinkP3.pink9,
// Earth tones & Neutrals
bronze: RadixColors.bronzeP3.bronze9,
gold: RadixColors.goldP3.gold9,
brown: RadixColors.brownP3.brown9,
gray: GRAY_SCALE_LIGHT.gray7,
};