# Gradient
URL: /foundations/gradient
Source: https://github.com/daangn/seed-design/blob/dev/docs/content/foundations/gradient.mdx

그라디언트는 배경과 아이콘 등에서 입체감이나 AI 기능을 표현할 때 사용하는 색상 토큰입니다.

## Gradient Stops

| Token | theme-light | theme-dark |
| --- | --- | --- |
| $gradient.glow-magic | [{"color":"#fef6f7","position":0},{"color":"#fef0e7","position":0.8},{"color":"#f9f7f5","position":1}] | [{"color":"#2d252d","position":0},{"color":"#3a312b","position":0.8},{"color":"#333232","position":1}] |
| $gradient.glow-magic-pressed | [{"color":"#fbf0f2","position":0},{"color":"#ffe8db","position":0.8},{"color":"#f5f2ef","position":1}] | [{"color":"#3e333e","position":0},{"color":"#51453e","position":0.8},{"color":"#434242","position":1}] |
| $gradient.highlight-magic | [{"color":"#ff6600","position":0.2},{"color":"#d25aca","position":1}] | [{"color":"#ff6600","position":0.2},{"color":"#d25aca","position":1}] |
| $gradient.highlight-magic-pressed | [{"color":"#e14f00","position":0.2},{"color":"#ae58bf","position":1}] | [{"color":"#ff9e65","position":0.2},{"color":"#e89bee","position":1}] |
| $gradient.shimmer-magic | [{"color":"#fff9f500","position":0},{"color":"#fff9f5cc","position":0.46},{"color":"#fff9f5cc","position":0.54},{"color":"#fff9f500","position":1}] | [{"color":"#fff9f500","position":0},{"color":"#fff9f51a","position":0.46},{"color":"#fff9f51a","position":0.54},{"color":"#fff9f500","position":1}] |
| $gradient.shimmer-neutral | [{"color":"#ffffff00","position":0},{"color":"#ffffffab","position":0.46},{"color":"#ffffffab","position":0.54},{"color":"#ffffff00","position":1}] | [{"color":"#ffffff00","position":0},{"color":"#ffffff1a","position":0.46},{"color":"#ffffff1a","position":0.54},{"color":"#ffffff00","position":1}] |