Indigo Chip Component - Accessible Colors for Success, Warn and Error Chip

[sbayreva]

New colors for Success, Warn and Error Chip @andiesm813

For reference, please, check the Chip Handoff

Success Chip:

Light Mode:

1. Idle Background: Success 800; idle Foreground: White
2. Hover Background: Success 700; Hover Foreground: White
3. Focused Background: Success 800, Focused Halo: Success 200; Focused Foreground: White
4. Disabled Background: Success 800; Disabled Foreground: White and the whole chip with 40% opacity

Dark Mode:

1. Idle Background: Success 800; idle Foreground: White
2. Hover Background: Success 700; Hover Foreground: White
3. Focused Background: Success 800, Focused Halo: Success 900; Focused Foreground: White
4. Disabled Background: Success 800; Disabled Foreground: White and the whole chip with 40% opacity

Warn Chip:

Light Mode:

1. Idle Background: Warn 500; Idle Foreground: Grays 900
2. Hover Background: Warn 400; Hover Foreground: Grays 900
3. Focused Background: Warn 500; Focused Halo: Warn 100; Focused Foreground: Grays 900
4. Disabled Background: Warn 500; Disabled Foreground: Grays 900 and the whole chip with 40% opacity

Dark Mode:

1. Idle Background: Warn 500; Idle Foreground: Grays 50
2. Hover Background: Warn 400; Hover Foreground: Grays 50
3. Focused Background: Warn 500, Focused Halo: Warn 900; Focused Foreground: Grays 50
4. Disabled Background: Warn 500; Disabled Foreground: Grays 50 and the whole chip with 40% opacity

Error Chip:

Light Mode:

1. Idle Background: Error 600; Idle Foreground: White
2. Hover Background: Error 500; Hover Foreground: White
3. Focused Background: Error 600, Focused Halo: Error 100; Focused Foreground: White
4. Disabled Background: Error 600; Disabled Foreground: White and the whole chip with 40% opacity

Dark Mode:

1. Idle Background: Error 600; Idle Foreground: White
2. Hover Background: Error 500; Hover Foreground: White
3. Focused Background: Error 600, Focused Halo: Error 900; Focused Foreground: White
4. Disabled Background: Error 600; Disabled Foreground: White and the whole chip with 40% opacity

[sbayreva]

@andiesm813

[andiesm813]

@sbayreva i made a comment in Figma regarding the warning chip foreground

[sbayreva]

@sbayreva i made a comment in Figma regarding the warning chip foreground

Already applied:
Foreground for Warn Chip: Grays 900 for Light Mode and Grays 50 for Dark Mode