npm - @refineui/tokens - Versions diffs - 1.0.0 - Mend

@refineui/tokens 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/README.md +80 -0
package/dist/css-variables.css +672 -0
package/dist/index.d.mts +1049 -0
package/dist/index.d.ts +1049 -0
package/dist/index.js +978 -0
package/dist/index.mjs +921 -0
package/dist/refineui-typography.css +111 -0
package/dist/spec/component-sizes.json +485 -0
package/dist/spec/focus.json +20 -0
package/dist/spec/foundation.json +90 -0
package/dist/spec/index.json +25 -0
package/dist/spec/motion.json +78 -0
package/dist/spec/semantic-colors.json +1256 -0
package/dist/spec/semantic-text.json +173 -0
package/dist/spec/token-graph.json +1194 -0
package/dist/spec/trace-index.json +830 -0
package/dist/spec/trace-v2.json +973 -0
package/dist/tailwind-theme.css +348 -0
package/package.json +50 -0
package/tailwind.css +4 -0

package/dist/spec/trace-v2.json ADDED Viewed

@@ -0,0 +1,973 @@
+{
+  "schemaVersion": 2,
+  "contractLayer": "semantic-token-trace",
+  "generatedAt": "2026-09-08T10:52:31.438Z",
+  "tokens": {
+    "backgroundBrandActive": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand-active",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        },
+        "dark": {
+          "foundation": "primaryLightGray",
+          "value": "#E6E6E6"
+        }
+      }
+    },
+    "backgroundBrandDisabled": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand-disabled",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral150",
+          "value": "#F0F0F0"
+        },
+        "dark": {
+          "foundation": "neutral650",
+          "value": "#5B5B5B"
+        }
+      }
+    },
+    "backgroundBrandHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryDarkGray",
+          "value": "#4d4d4d"
+        },
+        "dark": {
+          "foundation": "primaryLightGray",
+          "value": "#E6E6E6"
+        }
+      }
+    },
+    "backgroundBrandStrong": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand-strong",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryDarkGray",
+          "value": "#4d4d4d"
+        },
+        "dark": {
+          "foundation": "primaryGray",
+          "value": "#D4D4D4"
+        }
+      }
+    },
+    "backgroundBrandSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryLightGray",
+          "value": "#E6E6E6"
+        },
+        "dark": {
+          "foundation": "neutral800",
+          "value": "#2A2A2A"
+        }
+      }
+    },
+    "backgroundBrand": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-brand",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryBlack",
+          "value": "#212121"
+        },
+        "dark": {
+          "foundation": "primaryGray",
+          "value": "#D4D4D4"
+        }
+      }
+    },
+    "backgroundDiscoveryHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-discovery-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "purple700",
+          "value": "#9E3FFF"
+        },
+        "dark": {
+          "foundation": "purple300",
+          "value": "#D6AEFF"
+        }
+      }
+    },
+    "backgroundDiscoverySubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-discovery-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "purple100",
+          "value": "#EFDFFF"
+        },
+        "dark": {
+          "foundation": "purple900",
+          "value": "#7318D0"
+        }
+      }
+    },
+    "backgroundDiscovery": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-discovery",
+      "resolvesTo": {
+        "light": {
+          "foundation": "purple500",
+          "value": "#BD7BFF"
+        },
+        "dark": {
+          "foundation": "purple500",
+          "value": "#BD7BFF"
+        }
+      }
+    },
+    "backgroundErrorHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-error-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "red700",
+          "value": "#D93A3A"
+        },
+        "dark": {
+          "foundation": "red300",
+          "value": "#FFA7A7"
+        }
+      }
+    },
+    "backgroundErrorSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-error-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "red100",
+          "value": "#FFDEDE"
+        },
+        "dark": {
+          "foundation": "red900",
+          "value": "#9C2929"
+        }
+      }
+    },
+    "backgroundError": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-error",
+      "resolvesTo": {
+        "light": {
+          "foundation": "red500",
+          "value": "#FF6969"
+        },
+        "dark": {
+          "foundation": "red500",
+          "value": "#FF6969"
+        }
+      }
+    },
+    "backgroundInfoHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-info-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue700",
+          "value": "#3E68FF"
+        },
+        "dark": {
+          "foundation": "blue300",
+          "value": "#A9BCFF"
+        }
+      }
+    },
+    "backgroundInfoSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-info-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue100",
+          "value": "#DEE5FF"
+        },
+        "dark": {
+          "foundation": "blue900",
+          "value": "#1D44CE"
+        }
+      }
+    },
+    "backgroundInfo": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-info",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue500",
+          "value": "#7694FF"
+        },
+        "dark": {
+          "foundation": "blue500",
+          "value": "#7694FF"
+        }
+      }
+    },
+    "backgroundPrimaryActive": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-primary-active",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral150",
+          "value": "#F0F0F0"
+        },
+        "dark": {
+          "foundation": "neutral800",
+          "value": "#2A2A2A"
+        }
+      }
+    },
+    "backgroundPrimaryHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-primary-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral100",
+          "value": "#F5F5F5"
+        },
+        "dark": {
+          "foundation": "neutral850",
+          "value": "#222222"
+        }
+      }
+    },
+    "backgroundPrimary": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-primary",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutral900",
+          "value": "#1A1A1A"
+        }
+      }
+    },
+    "backgroundSuccessHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-success-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "green700",
+          "value": "#1D8822"
+        },
+        "dark": {
+          "foundation": "green300",
+          "value": "#2FDC37"
+        }
+      }
+    },
+    "backgroundSuccessSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-success-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "green100",
+          "value": "#ADF7B0"
+        },
+        "dark": {
+          "foundation": "green900",
+          "value": "#156119"
+        }
+      }
+    },
+    "backgroundSuccess": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-success",
+      "resolvesTo": {
+        "light": {
+          "foundation": "green500",
+          "value": "#26B12D"
+        },
+        "dark": {
+          "foundation": "green500",
+          "value": "#26B12D"
+        }
+      }
+    },
+    "backgroundSurfaceActive": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-surface-active",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral150",
+          "value": "#F0F0F0"
+        },
+        "dark": {
+          "foundation": "neutral700",
+          "value": "#404040"
+        }
+      }
+    },
+    "backgroundSurfaceDisabled": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-surface-disabled",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral150",
+          "value": "#F0F0F0"
+        },
+        "dark": {
+          "foundation": "neutral850",
+          "value": "#222222"
+        }
+      }
+    },
+    "backgroundSurfaceHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-surface-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral100",
+          "value": "#F5F5F5"
+        },
+        "dark": {
+          "foundation": "neutral750",
+          "value": "#333333"
+        }
+      }
+    },
+    "backgroundSurfaceSelected": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-surface-selected",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral200",
+          "value": "#EBEBEB"
+        },
+        "dark": {
+          "foundation": "neutral650",
+          "value": "#5B5B5B"
+        }
+      }
+    },
+    "backgroundSurface": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-surface",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutral800",
+          "value": "#2A2A2A"
+        }
+      }
+    },
+    "backgroundWarningHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-warning-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "yellow500",
+          "value": "#C49200"
+        },
+        "dark": {
+          "foundation": "yellow200",
+          "value": "#FFCB2F"
+        }
+      }
+    },
+    "backgroundWarningSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-warning-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "yellow100",
+          "value": "#FFE493"
+        },
+        "dark": {
+          "foundation": "yellow900",
+          "value": "#6B5000"
+        }
+      }
+    },
+    "backgroundWarning": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-background-warning",
+      "resolvesTo": {
+        "light": {
+          "foundation": "yellow300",
+          "value": "#F1B500"
+        },
+        "dark": {
+          "foundation": "yellow300",
+          "value": "#F1B500"
+        }
+      }
+    },
+    "borderDefault": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-default",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral300",
+          "value": "#DBDBDB"
+        },
+        "dark": {
+          "foundation": "neutral650",
+          "value": "#5B5B5B"
+        }
+      }
+    },
+    "borderDisabled": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-disabled",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral250",
+          "value": "#E0E0E0"
+        },
+        "dark": {
+          "foundation": "neutral700",
+          "value": "#404040"
+        }
+      }
+    },
+    "borderDiscovery": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-discovery",
+      "resolvesTo": {
+        "light": {
+          "foundation": "purple500",
+          "value": "#BD7BFF"
+        },
+        "dark": {
+          "foundation": "purple500",
+          "value": "#BD7BFF"
+        }
+      }
+    },
+    "borderError": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-error",
+      "resolvesTo": {
+        "light": {
+          "foundation": "red500",
+          "value": "#FF6969"
+        },
+        "dark": {
+          "foundation": "red500",
+          "value": "#FF6969"
+        }
+      }
+    },
+    "borderFocus": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-focus",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral750",
+          "value": "#333333"
+        },
+        "dark": {
+          "foundation": "neutral350",
+          "value": "#D8D8D8"
+        }
+      }
+    },
+    "borderHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral500",
+          "value": "#A4A4A4"
+        },
+        "dark": {
+          "foundation": "neutral500",
+          "value": "#A4A4A4"
+        }
+      }
+    },
+    "borderInfo": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-info",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue500",
+          "value": "#7694FF"
+        },
+        "dark": {
+          "foundation": "blue500",
+          "value": "#7694FF"
+        }
+      }
+    },
+    "borderStrong": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-strong",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral450",
+          "value": "#BBBBBB"
+        },
+        "dark": {
+          "foundation": "neutral550",
+          "value": "#8D8D8D"
+        }
+      }
+    },
+    "borderSubtle": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-subtle",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral200",
+          "value": "#EBEBEB"
+        },
+        "dark": {
+          "foundation": "neutral750",
+          "value": "#333333"
+        }
+      }
+    },
+    "borderSuccess": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-success",
+      "resolvesTo": {
+        "light": {
+          "foundation": "green500",
+          "value": "#26B12D"
+        },
+        "dark": {
+          "foundation": "green500",
+          "value": "#26B12D"
+        }
+      }
+    },
+    "borderWarning": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-border-warning",
+      "resolvesTo": {
+        "light": {
+          "foundation": "yellow300",
+          "value": "#F1B500"
+        },
+        "dark": {
+          "foundation": "yellow300",
+          "value": "#F1B500"
+        }
+      }
+    },
+    "foregroundBrandStrong": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-brand-strong",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        },
+        "dark": {
+          "foundation": "primaryLightGray",
+          "value": "#E6E6E6"
+        }
+      }
+    },
+    "foregroundBrand": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-brand",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryBlack",
+          "value": "#212121"
+        },
+        "dark": {
+          "foundation": "primaryGray",
+          "value": "#D4D4D4"
+        }
+      }
+    },
+    "foregroundDisabled": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-disabled",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral400",
+          "value": "#CECECE"
+        },
+        "dark": {
+          "foundation": "neutral600",
+          "value": "#6C6C6C"
+        }
+      }
+    },
+    "foregroundDiscovery": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-discovery",
+      "resolvesTo": {
+        "light": {
+          "foundation": "purple700",
+          "value": "#9E3FFF"
+        },
+        "dark": {
+          "foundation": "purple200",
+          "value": "#E3C7FF"
+        }
+      }
+    },
+    "foregroundError": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-error",
+      "resolvesTo": {
+        "light": {
+          "foundation": "red700",
+          "value": "#D93A3A"
+        },
+        "dark": {
+          "foundation": "red200",
+          "value": "#FFC3C3"
+        }
+      }
+    },
+    "foregroundInfo": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-info",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue700",
+          "value": "#3E68FF"
+        },
+        "dark": {
+          "foundation": "blue200",
+          "value": "#C3D0FF"
+        }
+      }
+    },
+    "foregroundInversed": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-inversed",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "primaryBlack",
+          "value": "#212121"
+        }
+      }
+    },
+    "foregroundLinkActive": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-link-active",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue900",
+          "value": "#1D44CE"
+        },
+        "dark": {
+          "foundation": "blue200",
+          "value": "#C3D0FF"
+        }
+      }
+    },
+    "foregroundLinkHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-link-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue800",
+          "value": "#2351F7"
+        },
+        "dark": {
+          "foundation": "blue300",
+          "value": "#A9BCFF"
+        }
+      }
+    },
+    "foregroundLinkVisited": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-link-visited",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue500",
+          "value": "#7694FF"
+        },
+        "dark": {
+          "foundation": "blue100",
+          "value": "#DEE5FF"
+        }
+      }
+    },
+    "foregroundLink": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-link",
+      "resolvesTo": {
+        "light": {
+          "foundation": "blue700",
+          "value": "#3E68FF"
+        },
+        "dark": {
+          "foundation": "blue400",
+          "value": "#90A8FF"
+        }
+      }
+    },
+    "foregroundOnBrand": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-brand",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundOnDiscovery": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-discovery",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundOnError": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-error",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundOnInfo": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-info",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundOnSuccess": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-success",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundOnWarning": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-on-warning",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        }
+      }
+    },
+    "foregroundPlaceholder": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-placeholder",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral450",
+          "value": "#BBBBBB"
+        },
+        "dark": {
+          "foundation": "neutral500",
+          "value": "#A4A4A4"
+        }
+      }
+    },
+    "foregroundPrimaryHover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-primary-hover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        },
+        "dark": {
+          "foundation": "neutral100",
+          "value": "#F5F5F5"
+        }
+      }
+    },
+    "foregroundPrimary": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-primary",
+      "resolvesTo": {
+        "light": {
+          "foundation": "primaryBlack",
+          "value": "#212121"
+        },
+        "dark": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        }
+      }
+    },
+    "foregroundSecondary": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-secondary",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral600",
+          "value": "#6C6C6C"
+        },
+        "dark": {
+          "foundation": "neutral350",
+          "value": "#D8D8D8"
+        }
+      }
+    },
+    "foregroundSuccess": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-success",
+      "resolvesTo": {
+        "light": {
+          "foundation": "green700",
+          "value": "#1D8822"
+        },
+        "dark": {
+          "foundation": "green200",
+          "value": "#5BEE62"
+        }
+      }
+    },
+    "foregroundTertiary": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-tertiary",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral500",
+          "value": "#A4A4A4"
+        },
+        "dark": {
+          "foundation": "neutral450",
+          "value": "#BBBBBB"
+        }
+      }
+    },
+    "foregroundWarning": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-foreground-warning",
+      "resolvesTo": {
+        "light": {
+          "foundation": "yellow700",
+          "value": "#967000"
+        },
+        "dark": {
+          "foundation": "yellow200",
+          "value": "#FFCB2F"
+        }
+      }
+    },
+    "surfaceElevated": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-surface-elevated",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutral700",
+          "value": "#404040"
+        }
+      }
+    },
+    "surfaceInverse": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-surface-inverse",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralBlack",
+          "value": "#000000"
+        },
+        "dark": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        }
+      }
+    },
+    "surfacePopover": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-surface-popover",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutralWhite",
+          "value": "#FFFFFF"
+        },
+        "dark": {
+          "foundation": "neutral750",
+          "value": "#333333"
+        }
+      }
+    },
+    "surfaceSunken": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-surface-sunken",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral150",
+          "value": "#F0F0F0"
+        },
+        "dark": {
+          "foundation": "neutral800",
+          "value": "#2A2A2A"
+        }
+      }
+    },
+    "surfaceTooltip": {
+      "type": "semantic",
+      "cssVar": "--refineui-color-alias-surface-tooltip",
+      "resolvesTo": {
+        "light": {
+          "foundation": "neutral750",
+          "value": "#333333"
+        },
+        "dark": {
+          "foundation": "neutral300",
+          "value": "#DBDBDB"
+        }
+      }
+    }
+  }
+}