diff --git a/package.json b/package.json
index 84383f90750..ede05332b2d 100644
--- a/package.json
+++ b/package.json
@@ -52,6 +52,7 @@
       "packages/twenty-server",
       "packages/twenty-emails",
       "packages/twenty-ui",
+      "packages/twenty-new-ui",
       "packages/twenty-utils",
       "packages/twenty-zapier",
       "packages/twenty-website",
diff --git a/packages/twenty-new-ui/.oxlintrc.json b/packages/twenty-new-ui/.oxlintrc.json
new file mode 100644
index 00000000000..4fc53020dc6
--- /dev/null
+++ b/packages/twenty-new-ui/.oxlintrc.json
@@ -0,0 +1,77 @@
+{
+  "$schema": "./node_modules/oxlint/configuration_schema.json",
+  "plugins": ["react", "typescript", "import", "unicorn"],
+  "jsPlugins": ["../twenty-oxlint-rules/dist/oxlint-plugin.mjs"],
+  "categories": {
+    "correctness": "off"
+  },
+  "ignorePatterns": ["node_modules", "generated", "**/*.module.scss.d.ts"],
+  "rules": {
+    "func-style": ["error", "declaration", { "allowArrowFunctions": true }],
+    "no-console": [
+      "warn",
+      { "allow": ["group", "groupCollapsed", "groupEnd"] }
+    ],
+    "no-control-regex": "off",
+    "no-debugger": "error",
+    "no-duplicate-imports": "error",
+    "no-undef": "off",
+    "no-unused-vars": "off",
+    "no-redeclare": "off",
+
+    "import/no-duplicates": "error",
+
+    "react/no-unescaped-entities": "off",
+    "react/prop-types": "off",
+    "react/jsx-key": "off",
+    "react/display-name": "off",
+    "react/jsx-uses-react": "off",
+    "react/react-in-jsx-scope": "off",
+    "react/jsx-no-useless-fragment": "off",
+    "react/jsx-props-no-spreading": ["error", { "explicitSpread": "ignore" }],
+
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn",
+
+    "typescript/no-redeclare": "error",
+    "typescript/ban-ts-comment": "error",
+    "typescript/consistent-type-imports": [
+      "error",
+      {
+        "prefer": "type-imports",
+        "fixStyle": "inline-type-imports"
+      }
+    ],
+    "typescript/explicit-function-return-type": "off",
+    "typescript/explicit-module-boundary-types": "off",
+    "typescript/no-empty-object-type": [
+      "error",
+      {
+        "allowInterfaces": "with-single-extends"
+      }
+    ],
+    "typescript/no-empty-function": "off",
+    "typescript/no-explicit-any": "off",
+    "typescript/no-unused-vars": [
+      "warn",
+      {
+        "vars": "all",
+        "varsIgnorePattern": "^_",
+        "args": "after-used",
+        "argsIgnorePattern": "^_"
+      }
+    ],
+
+    "twenty/enforce-module-boundaries": [
+      "error",
+      {
+        "depConstraints": [
+          {
+            "sourceTag": "scope:shared",
+            "onlyDependOnLibsWithTags": ["scope:shared"]
+          }
+        ]
+      }
+    ]
+  }
+}
diff --git a/packages/twenty-new-ui/.prettierignore b/packages/twenty-new-ui/.prettierignore
new file mode 100644
index 00000000000..6ee35b180ea
--- /dev/null
+++ b/packages/twenty-new-ui/.prettierignore
@@ -0,0 +1,6 @@
+dist
+storybook-static
+coverage
+
+# Generated by vite-plugin-sass-dts (committed; regenerated in dev mode).
+*.module.scss.d.ts
diff --git a/packages/twenty-new-ui/.size-limit.json b/packages/twenty-new-ui/.size-limit.json
new file mode 100644
index 00000000000..982175df273
--- /dev/null
+++ b/packages/twenty-new-ui/.size-limit.json
@@ -0,0 +1,78 @@
+[
+  {
+    "name": ". (root barrel)",
+    "path": "dist/index.mjs",
+    "limit": "60 kB",
+    "import": "*"
+  },
+  {
+    "name": "accessibility",
+    "path": "dist/accessibility.mjs",
+    "limit": "10 kB"
+  },
+  {
+    "name": "assets",
+    "path": "dist/assets.mjs",
+    "limit": "10 kB"
+  },
+  {
+    "name": "testing",
+    "path": "dist/testing.mjs",
+    "limit": "10 kB"
+  },
+  {
+    "name": "components",
+    "path": "dist/components.mjs",
+    "limit": "40 kB"
+  },
+  {
+    "name": "display",
+    "path": "dist/display.mjs",
+    "limit": "30 kB"
+  },
+  {
+    "name": "feedback",
+    "path": "dist/feedback.mjs",
+    "limit": "20 kB"
+  },
+  {
+    "name": "input",
+    "path": "dist/input.mjs",
+    "limit": "50 kB"
+  },
+  {
+    "name": "layout",
+    "path": "dist/layout.mjs",
+    "limit": "20 kB"
+  },
+  {
+    "name": "navigation",
+    "path": "dist/navigation.mjs",
+    "limit": "20 kB"
+  },
+  {
+    "name": "json-visualizer",
+    "path": "dist/json-visualizer.mjs",
+    "limit": "30 kB"
+  },
+  {
+    "name": "theme",
+    "path": "dist/theme.mjs",
+    "limit": "55 kB"
+  },
+  {
+    "name": "theme-constants",
+    "path": "dist/theme-constants.mjs",
+    "limit": "20 kB"
+  },
+  {
+    "name": "utilities",
+    "path": "dist/utilities.mjs",
+    "limit": "10 kB"
+  },
+  {
+    "name": "style.css",
+    "path": "dist/style.css",
+    "limit": "40 kB"
+  }
+]
diff --git a/packages/twenty-new-ui/.storybook/main.ts b/packages/twenty-new-ui/.storybook/main.ts
new file mode 100644
index 00000000000..e79c72ab860
--- /dev/null
+++ b/packages/twenty-new-ui/.storybook/main.ts
@@ -0,0 +1,58 @@
+import type { StorybookConfig } from '@storybook/react-vite';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import checker from 'vite-plugin-checker';
+
+const dirname =
+  typeof __dirname !== 'undefined'
+    ? __dirname
+    : path.dirname(fileURLToPath(import.meta.url));
+
+const isVitest = Boolean(process.env.VITEST);
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'],
+
+  addons: [
+    '@storybook-community/storybook-addon-cookie',
+    '@storybook/addon-links',
+    '@storybook/addon-coverage',
+    '@storybook/addon-a11y',
+    'storybook-addon-pseudo-states',
+    '@storybook/addon-vitest',
+  ],
+
+  framework: '@storybook/react-vite',
+
+  viteFinal: async (viteConfig) => {
+    const plugins = [...(viteConfig.plugins ?? [])];
+
+    if (!isVitest) {
+      plugins.push(
+        checker({
+          typescript: {
+            tsconfigPath: path.resolve(dirname, '../tsconfig.json'),
+          },
+        }),
+      );
+    }
+
+    return {
+      ...viteConfig,
+      plugins,
+      resolve: {
+        ...viteConfig.resolve,
+        alias: {
+          ...(viteConfig.resolve?.alias ?? {}),
+          '@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
+        },
+      },
+    };
+  },
+};
+
+export default config;
+
+// To customize your Vite configuration you can use the viteFinal field.
+// Check https://storybook.js.org/docs/react/builders/vite#configuration
+// and https://nx.dev/recipes/storybook/custom-builder-configs
diff --git a/packages/twenty-new-ui/.storybook/preview-head.html b/packages/twenty-new-ui/.storybook/preview-head.html
new file mode 100644
index 00000000000..534a4fb9bee
--- /dev/null
+++ b/packages/twenty-new-ui/.storybook/preview-head.html
@@ -0,0 +1,34 @@
+<link
+  href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap"
+  rel="stylesheet"
+/>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.7/iframeResizer.contentWindow.min.js"></script>
+
+<style type="text/css">
+  body {
+    margin: 0;
+    font-family: 'Inter', sans-serif;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+  html {
+    font-size: 13px;
+  }
+  .sbdocs-wrapper {
+    padding: 0 !important;
+  }
+  *::-webkit-scrollbar {
+    height: 4px;
+    width: 4px;
+  }
+
+  *::-webkit-scrollbar-corner {
+    background-color: transparent;
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background-color: transparent;
+    border-radius: 2px;
+  }
+</style>
diff --git a/packages/twenty-new-ui/.storybook/preview.tsx b/packages/twenty-new-ui/.storybook/preview.tsx
new file mode 100644
index 00000000000..05f01e57378
--- /dev/null
+++ b/packages/twenty-new-ui/.storybook/preview.tsx
@@ -0,0 +1,24 @@
+import { type Preview } from '@storybook/react-vite';
+import '@new-ui/theme-constants/theme-light.css';
+import '@new-ui/theme-constants/theme-dark.css';
+import { ThemeProvider } from '@new-ui/theme-constants';
+
+const preview: Preview = {
+  tags: ['autodocs'],
+  parameters: {
+    a11y: {
+      test: 'error',
+    },
+  },
+  decorators: [
+    (Story) => {
+      return (
+        <ThemeProvider colorScheme="light">
+          <Story />
+        </ThemeProvider>
+      );
+    },
+  ],
+};
+
+export default preview;
diff --git a/packages/twenty-new-ui/.storybook/vitest.setup.ts b/packages/twenty-new-ui/.storybook/vitest.setup.ts
new file mode 100644
index 00000000000..8b25f1ffbb4
--- /dev/null
+++ b/packages/twenty-new-ui/.storybook/vitest.setup.ts
@@ -0,0 +1,5 @@
+import { setProjectAnnotations } from '@storybook/react-vite';
+import * as projectAnnotations from './preview';
+
+// Apply Storybook's preview configuration to Vitest runs.
+setProjectAnnotations([projectAnnotations]);
diff --git a/packages/twenty-new-ui/README.md b/packages/twenty-new-ui/README.md
index cc0c1a438bd..b09043b79d1 100644
--- a/packages/twenty-new-ui/README.md
+++ b/packages/twenty-new-ui/README.md
@@ -1,6 +1,10 @@
 # twenty-new-ui
 
-> **Status:** Planning. This is a design document; no implementation has started.
+> **Status:** Phase 0 — Foundations in progress. The package is scaffolded and builds
+> on SCSS Modules + Base UI; the theme layer is ported from `twenty-ui` with a parity
+> test, and the size/Storybook/a11y harnesses are wired up. Remaining Phase 0 work: the
+> CI diff-table workflow, the `twenty-ui` component inventory, and the `modules/ui` triage.
+> The sections below remain the design document for the full effort.
 
 `twenty-new-ui` is the next generation of Twenty's UI library, replacing [`twenty-ui`](../twenty-ui).
 It is built on a headless component library and a zero-runtime, CSS-variable styling layer.
@@ -30,8 +34,9 @@ components are now **in scope** — they migrate into `twenty-new-ui` (see [Appl
 
 ## Decision 1 — Headless library: Base UI
 
-Adopt **Base UI** (`@base-ui-components/react`, MIT) as the behavioral foundation; build Twenty's
-visual design on top of it.
+Adopt **Base UI** ([`mui/base-ui`](https://github.com/mui/base-ui), published to npm as
+[`@base-ui/react`](https://base-ui.com), MIT) as the behavioral foundation; build Twenty's visual
+design on top of it.
 
 | | Base UI | shadcn/ui | Radix |
 | --- | --- | --- | --- |
@@ -84,7 +89,7 @@ packages/twenty-new-ui/
 ├── vitest.config.ts        # storybook component tests
 ├── .storybook/
 ├── .size-limit.json        # per-entry bundle budgets
-├── scripts/                # generateBarrels.ts, generateTheme.ts
+├── scripts/                # generateBarrels.ts
 └── src/
     ├── styles/             # global: reset, theme vars, mixins, breakpoints
     ├── theme/ theme-constants/
@@ -106,8 +111,8 @@ as-is.
 
 - Keep the public API identical: `ThemeProvider`, `ThemeContext`, `useTheme`, the `themeCssVariables` shape, `ThemeType`, color helpers, and the `theme-light.css` / `theme-dark.css` exports.
 - Reuse `twenty-ui`'s token values verbatim to guarantee identical design.
-- Tokens are authored in `src/theme/` and generated into CSS variables + a typed accessor.
-- A generated-output diff test asserts the new theme CSS produces the same `--t-*` values as `twenty-ui`.
+- Tokens live in `src/theme/` (`THEME_LIGHT` / `THEME_DARK`); the `--t-*` CSS variables and the `themeCssVariables` accessor are static files mirrored token-for-token from `twenty-ui` (matching `twenty-ui`'s own static-CSS approach).
+- A theme parity test asserts the theme CSS and `themeCssVariables` stay identical to `twenty-ui`'s `--t-*` values.
 
 ## Component migration map
 
@@ -219,7 +224,7 @@ CI surfaces a per-PR diff table (`twenty-ui` vs `twenty-new-ui`) for size, a11y,
 
 - Vite library mode, dual ESM/CJS, `vite-plugin-dts`, `vite-plugin-svgr`; SCSS via Vite's built-in `sass`; no Babel.
 - `sideEffects: ["**/*.css", "**/*.scss"]`; emit per-entry CSS plus `style.css` / `theme-light.css` / `theme-dark.css`.
-- Public package (remove `private`); scoped name (e.g. `@twenty/ui`).
+- Public package (remove `private`); ships as `twenty-new-ui` until cut-over, then claims the `twenty-ui` name once the old package is removed.
 - **Changesets** for semver + changelog; GitHub Actions release with `npm publish --provenance`.
 - Declare `react` / `react-dom` as peer dependencies; validate the `exports`/types map with `publint` + `@arethetypeswrong/cli`.
 - Publish the Storybook as living documentation.
@@ -259,59 +264,10 @@ a passing visual-parity diff, and a within-budget size entry.
 
 ## Open questions
 
-1. Published package name/scope (proposed `@twenty/ui`).
+1. Published package name: `twenty-new-ui` now, renamed to `twenty-ui` at cut-over (Phase 6).
 2. Styling: confirm SCSS Modules vs vanilla-extract vs plain CSS Modules.
 3. Variants helper: `clsx` + `data-*` vs `cva`.
 4. Visual regression tooling: Chromatic vs self-hosted image snapshots.
 5. How aggressively to drop `framer-motion` in favor of CSS/Base UI transitions.
 6. Scope of `assets` / `testing` / `json-visualizer`: port verbatim or modernize.
 7. Where to draw the generic-vs-app-specific line for `modules/ui`, and whether hybrid components live as a headless core in `twenty-new-ui` with a thin app wrapper in `twenty-front`.
-
-## Appendix — example component pattern
-
-`src/input/components/Toggle.tsx`
-
-```tsx
-import { Switch } from '@base-ui-components/react/switch';
-import { clsx } from 'clsx';
-import styles from './Toggle.module.scss';
-
-type ToggleProps = {
-  value?: boolean;
-  onChange?: (value: boolean) => void;
-  disabled?: boolean;
-  size?: 'small' | 'medium';
-};
-
-export const Toggle = ({ value, onChange, disabled, size = 'medium' }: ToggleProps) => (
-  <Switch.Root
-    checked={value}
-    onCheckedChange={onChange}
-    disabled={disabled}
-    className={clsx(styles.root, styles[size])}
-  >
-    <Switch.Thumb className={styles.thumb} />
-  </Switch.Root>
-);
-```
-
-`src/input/components/Toggle.module.scss`
-
-```scss
-.root {
-  background: var(--t-background-quaternary);
-  border-radius: var(--t-border-radius-pill);
-  transition: background var(--t-animation-duration-fast) ease;
-
-  &[data-checked] { background: var(--t-color-blue); }
-  &[data-disabled] { opacity: 0.32; cursor: not-allowed; }
-}
-
-.thumb {
-  background: var(--t-background-primary);
-  border-radius: 50%;
-  transition: translate var(--t-animation-duration-fast) ease;
-
-  .root[data-checked] & { translate: 100% 0; }
-}
-```
diff --git a/packages/twenty-new-ui/__mocks__/imageMockUi.js b/packages/twenty-new-ui/__mocks__/imageMockUi.js
new file mode 100644
index 00000000000..602eb23ee2e
--- /dev/null
+++ b/packages/twenty-new-ui/__mocks__/imageMockUi.js
@@ -0,0 +1 @@
+export default 'test-file-stub';
diff --git a/packages/twenty-new-ui/__mocks__/styleMock.js b/packages/twenty-new-ui/__mocks__/styleMock.js
new file mode 100644
index 00000000000..4eaf68f45d4
--- /dev/null
+++ b/packages/twenty-new-ui/__mocks__/styleMock.js
@@ -0,0 +1,7 @@
+// Proxy so `styles.anyClassName` resolves to its key when SCSS is imported in Jest.
+module.exports = new Proxy(
+  {},
+  {
+    get: (_target, key) => (key === '__esModule' ? false : String(key)),
+  },
+);
diff --git a/packages/twenty-new-ui/jest.config.mjs b/packages/twenty-new-ui/jest.config.mjs
new file mode 100644
index 00000000000..265aa0dac8b
--- /dev/null
+++ b/packages/twenty-new-ui/jest.config.mjs
@@ -0,0 +1,41 @@
+import { readFileSync } from 'fs';
+import { dirname, resolve } from 'path';
+import { pathsToModuleNameMapper } from 'ts-jest';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const tsConfigPath = resolve(__dirname, './tsconfig.json');
+const tsConfig = JSON.parse(readFileSync(tsConfigPath, 'utf8'));
+
+const jestConfig = {
+  displayName: 'twenty-new-ui',
+  preset: '../../jest.preset.js',
+  setupFilesAfterEnv: ['./setupTests.ts'],
+  testEnvironment: 'jsdom',
+  transformIgnorePatterns: ['../../node_modules/'],
+  transform: {
+    '^.+\\.[tj]sx?$': [
+      '@swc/jest',
+      {
+        jsc: {
+          parser: { syntax: 'typescript', tsx: true },
+          transform: { react: { runtime: 'automatic' } },
+        },
+      },
+    ],
+  },
+  moduleNameMapper: {
+    '\\.(jpg|jpeg|png|gif|webp|svg|svg)$': '<rootDir>/__mocks__/imageMockUi.js',
+    '\\.(scss|css)$': '<rootDir>/__mocks__/styleMock.js',
+    ...pathsToModuleNameMapper(tsConfig.compilerOptions.paths, {
+      prefix: '<rootDir>/',
+    }),
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  extensionsToTreatAsEsm: ['.ts', '.tsx'],
+  coverageDirectory: './coverage',
+};
+
+export default jestConfig;
diff --git a/packages/twenty-new-ui/package.json b/packages/twenty-new-ui/package.json
new file mode 100644
index 00000000000..0955e62384a
--- /dev/null
+++ b/packages/twenty-new-ui/package.json
@@ -0,0 +1,208 @@
+{
+  "name": "twenty-new-ui",
+  "//name": "Named `twenty-new-ui` because the target name `twenty-ui` is still taken by the existing packages/twenty-ui workspace (Yarn forbids duplicate workspace names). Renamed to `twenty-ui` at the Phase 6 cut-over once the old package is removed.",
+  "version": "0.0.0",
+  "main": "dist/index.cjs",
+  "module": "dist/index.mjs",
+  "style": "./dist/style.css",
+  "type": "module",
+  "sideEffects": [
+    "**/*.css",
+    "**/*.scss"
+  ],
+  "devDependencies": {
+    "@argos-ci/storybook": "^6.0.6",
+    "@prettier/sync": "^0.5.2",
+    "@size-limit/preset-small-lib": "^11.1.6",
+    "@storybook-community/storybook-addon-cookie": "^5.0.0",
+    "@storybook/addon-a11y": "^10.3.3",
+    "@storybook/addon-coverage": "^3.0.0",
+    "@storybook/addon-links": "^10.3.3",
+    "@storybook/addon-vitest": "^10.2.13",
+    "@storybook/react-vite": "^10.3.3",
+    "@swc/core": "^1.15.11",
+    "@swc/jest": "^0.2.39",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.3.0",
+    "@types/jest": "^30.0.0",
+    "@types/react": "^18.2.39",
+    "@types/react-dom": "^18.2.15",
+    "@vitejs/plugin-react-swc": "4.2.3",
+    "@vitest/browser-playwright": "4.0.18",
+    "jest": "29.7.0",
+    "jest-environment-jsdom": "30.0.0-beta.3",
+    "prettier": "^3.1.1",
+    "sass": "^1.83.0",
+    "sass-embedded": "^1.83.0",
+    "size-limit": "^11.1.6",
+    "slash": "^5.1.0",
+    "storybook-addon-pseudo-states": "^10.3.3",
+    "ts-jest": "^29.1.1",
+    "tsx": "^4.19.3",
+    "vite-plugin-checker": "^0.10.2",
+    "vite-plugin-dts": "3.8.1",
+    "vite-plugin-sass-dts": "^1.3.31",
+    "vite-plugin-svgr": "^4.3.0",
+    "vite-tsconfig-paths": "^4.2.1",
+    "vitest": "4.0.18"
+  },
+  "dependencies": {
+    "@base-ui/react": "^1.5.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@radix-ui/colors": "^3.0.0",
+    "@tabler/icons-react": "^3.31.0",
+    "clsx": "^2.1.1",
+    "date-fns": "^2.30.0",
+    "framer-motion": "^11.18.0",
+    "glob": "^11.1.0",
+    "hex-rgb": "^5.0.0",
+    "jotai": "^2.17.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-responsive": "^9.0.2",
+    "react-router-dom": "^6.4.4",
+    "twenty-shared": "workspace:*",
+    "zod": "^4.1.11"
+  },
+  "peerDependencies": {
+    "monaco-editor": ">= 0.25.0 < 1"
+  },
+  "scripts": {
+    "build": "npx vite build"
+  },
+  "files": [
+    "dist",
+    "accessibility",
+    "assets",
+    "components",
+    "display",
+    "feedback",
+    "input",
+    "json-visualizer",
+    "layout",
+    "navigation",
+    "testing",
+    "theme",
+    "theme-constants",
+    "utilities"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./style.css": "./dist/style.css",
+    "./theme-light.css": "./dist/theme-light.css",
+    "./theme-dark.css": "./dist/theme-dark.css",
+    "./accessibility": {
+      "types": "./dist/accessibility/index.d.ts",
+      "import": "./dist/accessibility.mjs",
+      "require": "./dist/accessibility.cjs"
+    },
+    "./assets": {
+      "types": "./dist/assets/index.d.ts",
+      "import": "./dist/assets.mjs",
+      "require": "./dist/assets.cjs"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components.mjs",
+      "require": "./dist/components.cjs"
+    },
+    "./display": {
+      "types": "./dist/display/index.d.ts",
+      "import": "./dist/display.mjs",
+      "require": "./dist/display.cjs"
+    },
+    "./feedback": {
+      "types": "./dist/feedback/index.d.ts",
+      "import": "./dist/feedback.mjs",
+      "require": "./dist/feedback.cjs"
+    },
+    "./input": {
+      "types": "./dist/input/index.d.ts",
+      "import": "./dist/input.mjs",
+      "require": "./dist/input.cjs"
+    },
+    "./json-visualizer": {
+      "types": "./dist/json-visualizer/index.d.ts",
+      "import": "./dist/json-visualizer.mjs",
+      "require": "./dist/json-visualizer.cjs"
+    },
+    "./layout": {
+      "types": "./dist/layout/index.d.ts",
+      "import": "./dist/layout.mjs",
+      "require": "./dist/layout.cjs"
+    },
+    "./navigation": {
+      "types": "./dist/navigation/index.d.ts",
+      "import": "./dist/navigation.mjs",
+      "require": "./dist/navigation.cjs"
+    },
+    "./testing": {
+      "types": "./dist/testing/index.d.ts",
+      "import": "./dist/testing.mjs",
+      "require": "./dist/testing.cjs"
+    },
+    "./theme": {
+      "types": "./dist/theme/index.d.ts",
+      "import": "./dist/theme.mjs",
+      "require": "./dist/theme.cjs"
+    },
+    "./theme-constants": {
+      "types": "./dist/theme-constants/index.d.ts",
+      "import": "./dist/theme-constants.mjs",
+      "require": "./dist/theme-constants.cjs"
+    },
+    "./utilities": {
+      "types": "./dist/utilities/index.d.ts",
+      "import": "./dist/utilities.mjs",
+      "require": "./dist/utilities.cjs"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "accessibility": [
+        "dist/accessibility/index.d.ts"
+      ],
+      "assets": [
+        "dist/assets/index.d.ts"
+      ],
+      "components": [
+        "dist/components/index.d.ts"
+      ],
+      "display": [
+        "dist/display/index.d.ts"
+      ],
+      "feedback": [
+        "dist/feedback/index.d.ts"
+      ],
+      "input": [
+        "dist/input/index.d.ts"
+      ],
+      "json-visualizer": [
+        "dist/json-visualizer/index.d.ts"
+      ],
+      "layout": [
+        "dist/layout/index.d.ts"
+      ],
+      "navigation": [
+        "dist/navigation/index.d.ts"
+      ],
+      "testing": [
+        "dist/testing/index.d.ts"
+      ],
+      "theme": [
+        "dist/theme/index.d.ts"
+      ],
+      "theme-constants": [
+        "dist/theme-constants/index.d.ts"
+      ],
+      "utilities": [
+        "dist/utilities/index.d.ts"
+      ]
+    }
+  }
+}
diff --git a/packages/twenty-new-ui/project.json b/packages/twenty-new-ui/project.json
new file mode 100644
index 00000000000..2393c772547
--- /dev/null
+++ b/packages/twenty-new-ui/project.json
@@ -0,0 +1,103 @@
+{
+  "name": "twenty-new-ui",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "packages/twenty-new-ui/src",
+  "projectType": "library",
+  "tags": ["scope:shared"],
+  "targets": {
+    "build": {
+      "dependsOn": ["^build"],
+      "outputs": [
+        "{projectRoot}/dist",
+        "{projectRoot}/accessibility/package.json",
+        "{projectRoot}/accessibility/dist",
+        "{projectRoot}/assets/package.json",
+        "{projectRoot}/assets/dist",
+        "{projectRoot}/components/package.json",
+        "{projectRoot}/components/dist",
+        "{projectRoot}/display/package.json",
+        "{projectRoot}/display/dist",
+        "{projectRoot}/feedback/package.json",
+        "{projectRoot}/feedback/dist",
+        "{projectRoot}/input/package.json",
+        "{projectRoot}/input/dist",
+        "{projectRoot}/json-visualizer/package.json",
+        "{projectRoot}/json-visualizer/dist",
+        "{projectRoot}/layout/package.json",
+        "{projectRoot}/layout/dist",
+        "{projectRoot}/navigation/package.json",
+        "{projectRoot}/navigation/dist",
+        "{projectRoot}/testing/package.json",
+        "{projectRoot}/testing/dist",
+        "{projectRoot}/theme/package.json",
+        "{projectRoot}/theme/dist",
+        "{projectRoot}/theme-constants/package.json",
+        "{projectRoot}/theme-constants/dist",
+        "{projectRoot}/utilities/package.json",
+        "{projectRoot}/utilities/dist"
+      ]
+    },
+    "generateBarrels": {
+      "executor": "nx:run-commands",
+      "cache": true,
+      "inputs": ["production", "{projectRoot}/scripts/generateBarrels.ts"],
+      "outputs": [
+        "{projectRoot}/src/**/*/index.ts",
+        "{projectRoot}/package.json"
+      ],
+      "options": { "command": "tsx {projectRoot}/scripts/generateBarrels.ts" }
+    },
+    "build:individual": {
+      "executor": "nx:run-commands",
+      "cache": true,
+      "dependsOn": ["build"],
+      "inputs": ["production", "^production"],
+      "outputs": ["{projectRoot}/dist/individual"],
+      "options": {
+        "cwd": "{projectRoot}",
+        "command": "npx vite build -c vite.config.individual.ts"
+      }
+    },
+    "size": {
+      "executor": "nx:run-commands",
+      "cache": true,
+      "dependsOn": ["build"],
+      "inputs": ["{projectRoot}/dist", "{projectRoot}/.size-limit.json"],
+      "options": {
+        "cwd": "{projectRoot}",
+        "command": "npx size-limit"
+      },
+      "configurations": {
+        "why": { "command": "npx size-limit --why" }
+      }
+    },
+    "clean": {
+      "executor": "nx:run-commands",
+      "options": { "command": "rimraf {projectRoot}/dist" }
+    },
+    "lint": {},
+    "fmt": { "options": { "files": "src" }, "configurations": { "fix": {} } },
+    "test": {},
+    "typecheck": {},
+    "storybook:build": { "configurations": { "test": {} } },
+    "storybook:serve:dev": { "options": { "port": 6008 } },
+    "storybook:serve:static": {
+      "options": {
+        "buildTarget": "twenty-new-ui:storybook:build",
+        "port": 6008
+      },
+      "configurations": { "test": {} }
+    },
+    "storybook:test": {},
+    "storybook:test:no-coverage": {},
+    "storybook:visual-diff": {
+      "executor": "nx:run-commands",
+      "dependsOn": ["storybook:build"],
+      "options": {
+        "cwd": "{projectRoot}",
+        "command": "bash scripts/visual-diff.sh"
+      }
+    },
+    "storybook:coverage": {}
+  }
+}
diff --git a/packages/twenty-new-ui/scripts/generateBarrels.ts b/packages/twenty-new-ui/scripts/generateBarrels.ts
new file mode 100644
index 00000000000..ba6f271412e
--- /dev/null
+++ b/packages/twenty-new-ui/scripts/generateBarrels.ts
@@ -0,0 +1,505 @@
+import prettier from '@prettier/sync';
+import * as fs from 'fs';
+import { globSync } from 'glob';
+import path from 'path';
+import { type Options } from 'prettier';
+import slash from 'slash';
+import ts from 'typescript';
+
+// TODO prastoin refactor this file in several one into its dedicated package and make it a TypeScript CLI
+
+const INDEX_FILENAME = 'index';
+const PACKAGE_JSON_FILENAME = 'package.json';
+const NX_PROJECT_CONFIGURATION_FILENAME = 'project.json';
+const PACKAGE_PATH = path.resolve('packages/twenty-ui');
+const SRC_PATH = path.resolve(`${PACKAGE_PATH}/src`);
+const PACKAGE_JSON_PATH = path.join(PACKAGE_PATH, PACKAGE_JSON_FILENAME);
+const NX_PROJECT_CONFIGURATION_PATH = path.join(
+  PACKAGE_PATH,
+  NX_PROJECT_CONFIGURATION_FILENAME,
+);
+
+const prettierConfigFile = prettier.resolveConfigFile();
+if (prettierConfigFile == null) {
+  throw new Error('Prettier config file not found');
+}
+const prettierConfiguration = prettier.resolveConfig(prettierConfigFile);
+const prettierFormat = (str: string, parser: Options['parser']) =>
+  prettier.format(str, {
+    ...prettierConfiguration,
+    parser,
+  });
+type createTypeScriptFileArgs = {
+  path: string;
+  content: string;
+  filename: string;
+};
+const createTypeScriptFile = ({
+  content,
+  path: filePath,
+  filename,
+}: createTypeScriptFileArgs) => {
+  const header = `
+/*
+ * _____                    _
+ *|_   _|_      _____ _ __ | |_ _   _
+ *  | | \\ \\ /\\ / / _ \\ '_ \\| __| | | | Auto-generated file
+ *  | |  \\ V  V /  __/ | | | |_| |_| | Any edits to this will be overridden
+ *  |_|   \\_/\\_/ \\___|_| |_|\\__|\\__, |
+ *                              |___/
+ */
+`;
+  const formattedContent = prettierFormat(
+    `${header}\n${content}\n`,
+    'typescript',
+  );
+  fs.writeFileSync(
+    path.join(filePath, `${filename}.ts`),
+    formattedContent,
+    'utf-8',
+  );
+};
+
+const getLastPathFolder = (pathStr: string) => path.basename(pathStr);
+
+const getSubDirectoryPaths = (directoryPath: string): string[] => {
+  const pattern = slash(path.join(directoryPath, '*/'));
+  return globSync(pattern, {
+    ignore: [...EXCLUDED_DIRECTORIES],
+    cwd: SRC_PATH,
+    nodir: false,
+    maxDepth: 1,
+  }).sort((a, b) => a.localeCompare(b));
+};
+
+const partitionFileExportsByType = (declarations: DeclarationOccurrence[]) => {
+  return declarations.reduce<{
+    typeAndInterfaceDeclarations: DeclarationOccurrence[];
+    otherDeclarations: DeclarationOccurrence[];
+  }>(
+    (acc, { kind, name }) => {
+      if (kind === 'type' || kind === 'interface') {
+        return {
+          ...acc,
+          typeAndInterfaceDeclarations: [
+            ...acc.typeAndInterfaceDeclarations,
+            { kind, name },
+          ],
+        };
+      }
+
+      return {
+        ...acc,
+        otherDeclarations: [...acc.otherDeclarations, { kind, name }],
+      };
+    },
+    {
+      typeAndInterfaceDeclarations: [],
+      otherDeclarations: [],
+    },
+  );
+};
+
+const generateModuleIndexFiles = (exportByBarrel: ExportByBarrel[]) => {
+  return exportByBarrel.map<createTypeScriptFileArgs>(
+    ({ barrel: { moduleDirectory }, allFileExports }) => {
+      const content = allFileExports
+        .sort((a, b) => a.file.localeCompare(b.file))
+        .map(({ exports, file }) => {
+          const { otherDeclarations, typeAndInterfaceDeclarations } =
+            partitionFileExportsByType(exports);
+
+          const fileWithoutExtension = path.parse(file).name;
+          const pathToImport = slash(
+            path.relative(
+              moduleDirectory,
+              path.join(path.dirname(file), fileWithoutExtension),
+            ),
+          );
+          const mapDeclarationNameAndJoin = (
+            declarations: DeclarationOccurrence[],
+          ) => declarations.map(({ name }) => name).join(', ');
+
+          const typeExport =
+            typeAndInterfaceDeclarations.length > 0
+              ? `export type { ${mapDeclarationNameAndJoin(typeAndInterfaceDeclarations)} } from "./${pathToImport}"`
+              : '';
+          const othersExport =
+            otherDeclarations.length > 0
+              ? `export { ${mapDeclarationNameAndJoin(otherDeclarations)} } from "./${pathToImport}"`
+              : '';
+
+          return [typeExport, othersExport]
+            .filter((el) => el !== '')
+            .join('\n');
+        })
+        .join('\n');
+
+      return {
+        content,
+        path: moduleDirectory,
+        filename: INDEX_FILENAME,
+      };
+    },
+  );
+};
+
+type JsonUpdate = Record<string, any>;
+type WriteInJsonFileArgs = {
+  content: JsonUpdate;
+  file: string;
+};
+const updateJsonFile = ({ content, file }: WriteInJsonFileArgs) => {
+  const updatedJsonFile = JSON.stringify(content);
+  const formattedContent = prettier.format(updatedJsonFile, {
+    ...prettierConfiguration,
+    filepath: file,
+  });
+  fs.writeFileSync(file, formattedContent, 'utf-8');
+};
+
+const writeInPackageJson = (update: JsonUpdate) => {
+  const rawJsonFile = fs.readFileSync(PACKAGE_JSON_PATH, 'utf-8');
+  const initialJsonFile = JSON.parse(rawJsonFile);
+
+  updateJsonFile({
+    file: PACKAGE_JSON_PATH,
+    content: {
+      ...initialJsonFile,
+      ...update,
+    },
+  });
+};
+
+const updateNxProjectConfigurationBuildOutputs = (outputs: JsonUpdate) => {
+  const rawJsonFile = fs.readFileSync(NX_PROJECT_CONFIGURATION_PATH, 'utf-8');
+  const initialJsonFile = JSON.parse(rawJsonFile);
+
+  updateJsonFile({
+    file: NX_PROJECT_CONFIGURATION_PATH,
+    content: {
+      ...initialJsonFile,
+      targets: {
+        ...initialJsonFile.targets,
+        build: {
+          ...initialJsonFile.targets.build,
+          outputs,
+        },
+      },
+    },
+  });
+};
+
+type ExportOccurrence = {
+  types: string;
+  import: string;
+  require: string;
+};
+type ExportsConfig = Record<string, ExportOccurrence | string>;
+
+const generateModulePackageExports = (moduleDirectories: string[]) => {
+  return moduleDirectories.reduce<ExportsConfig>(
+    (acc, moduleDirectory) => {
+      const moduleName = getLastPathFolder(moduleDirectory);
+      if (moduleName === undefined) {
+        throw new Error(
+          `Should never occur, moduleName is undefined ${moduleDirectory}`,
+        );
+      }
+
+      return {
+        ...acc,
+        [`./${moduleName}`]: {
+          types: `./dist/${moduleName}/index.d.ts`,
+          import: `./dist/${moduleName}.mjs`,
+          require: `./dist/${moduleName}.cjs`,
+        },
+      };
+    },
+    {
+      './style.css': './dist/style.css',
+      './theme-light.css': './dist/theme-light.css',
+      './theme-dark.css': './dist/theme-dark.css',
+    },
+  );
+};
+
+const computePackageJsonFilesAndExportsConfig = (
+  moduleDirectories: string[],
+) => {
+  const entrypoints = moduleDirectories.map(getLastPathFolder);
+  const exports = {
+    '.': {
+      types: './dist/index.d.ts',
+      import: './dist/index.mjs',
+      require: './dist/index.cjs',
+    },
+    ...generateModulePackageExports(moduleDirectories),
+  } satisfies ExportsConfig;
+
+  const typesVersionsEntries = entrypoints.reduce<Record<string, string[]>>(
+    (acc, moduleName) => ({
+      ...acc,
+      [`${moduleName}`]: [`dist/${moduleName}/index.d.ts`],
+    }),
+    {},
+  );
+
+  return {
+    exports,
+    typesVersions: { '*': typesVersionsEntries },
+    files: ['dist', ...entrypoints],
+  };
+};
+
+const computeProjectNxBuildOutputsPath = (moduleDirectories: string[]) => {
+  const dynamicOutputsPath = moduleDirectories
+    .map(getLastPathFolder)
+    .flatMap((barrelName) =>
+      ['package.json', 'dist'].map(
+        (subPath) => `{projectRoot}/${barrelName}/${subPath}`,
+      ),
+    );
+
+  return ['{projectRoot}/dist', ...dynamicOutputsPath];
+};
+
+const EXCLUDED_EXTENSIONS = [
+  '**/*.test.ts',
+  '**/*.test.tsx',
+  '**/*.spec.ts',
+  '**/*.spec.tsx',
+  '**/*.stories.ts',
+  '**/*.stories.tsx',
+] as const;
+const EXCLUDED_DIRECTORIES = [
+  '**/__tests__/**',
+  '**/__mocks__/**',
+  '**/__stories__/**',
+  '**/internal/**',
+] as const;
+function getTypeScriptFiles(
+  directoryPath: string,
+  includeIndex: boolean = false,
+): string[] {
+  const pattern = slash(path.join(directoryPath, '**', '*.{ts,tsx}'));
+  const files = globSync(pattern, {
+    cwd: SRC_PATH,
+    nodir: true,
+    ignore: [...EXCLUDED_EXTENSIONS, ...EXCLUDED_DIRECTORIES],
+  });
+
+  return files.filter(
+    (file) =>
+      !file.endsWith('.d.ts') &&
+      (includeIndex ? true : !file.endsWith('index.ts')),
+  );
+}
+
+const getKind = (
+  node: ts.VariableStatement,
+): Extract<ExportKind, 'const' | 'let' | 'var'> => {
+  const isConst = (node.declarationList.flags & ts.NodeFlags.Const) !== 0;
+  if (isConst) {
+    return 'const';
+  }
+
+  const isLet = (node.declarationList.flags & ts.NodeFlags.Let) !== 0;
+  if (isLet) {
+    return 'let';
+  }
+
+  return 'var';
+};
+
+function extractExportsFromSourceFile(sourceFile: ts.SourceFile) {
+  const exports: DeclarationOccurrence[] = [];
+
+  function visit(node: ts.Node) {
+    if (!ts.canHaveModifiers(node)) {
+      return ts.forEachChild(node, visit);
+    }
+    const modifiers = ts.getModifiers(node);
+    const isExport = modifiers?.some(
+      (mod) => mod.kind === ts.SyntaxKind.ExportKeyword,
+    );
+
+    if (!isExport && !ts.isExportDeclaration(node)) {
+      return ts.forEachChild(node, visit);
+    }
+
+    switch (true) {
+      case ts.isTypeAliasDeclaration(node):
+        exports.push({
+          kind: 'type',
+          name: node.name.text,
+        });
+        break;
+
+      case ts.isInterfaceDeclaration(node):
+        exports.push({
+          kind: 'interface',
+          name: node.name.text,
+        });
+        break;
+
+      case ts.isEnumDeclaration(node):
+        exports.push({
+          kind: 'enum',
+          name: node.name.text,
+        });
+        break;
+
+      case ts.isFunctionDeclaration(node) && node.name !== undefined:
+        exports.push({
+          kind: 'function',
+          name: node.name.text,
+        });
+        break;
+
+      case ts.isVariableStatement(node):
+        node.declarationList.declarations.forEach((decl) => {
+          const kind = getKind(node);
+
+          if (ts.isIdentifier(decl.name)) {
+            exports.push({
+              kind,
+              name: decl.name.text,
+            });
+          } else if (ts.isObjectBindingPattern(decl.name)) {
+            decl.name.elements.forEach((element) => {
+              if (
+                !ts.isBindingElement(element) ||
+                !ts.isIdentifier(element.name)
+              ) {
+                return;
+              }
+
+              exports.push({
+                kind,
+                name: element.name.text,
+              });
+            });
+          }
+        });
+        break;
+
+      case ts.isClassDeclaration(node) && node.name !== undefined:
+        exports.push({
+          kind: 'class',
+          name: node.name.text,
+        });
+        break;
+      case ts.isExportDeclaration(node):
+        if (node.exportClause && ts.isNamedExports(node.exportClause)) {
+          node.exportClause.elements.forEach((element) => {
+            const exportName = element.name.text;
+
+            // Check both the declaration and the individual specifier for type-only exports
+            const isTypeExport =
+              node.isTypeOnly || ts.isTypeOnlyExportDeclaration(node);
+            if (isTypeExport) {
+              // should handle kind
+              exports.push({
+                kind: 'type',
+                name: exportName,
+              });
+              return;
+            }
+
+            exports.push({
+              kind: 'const',
+              name: exportName,
+            });
+          });
+        }
+        break;
+    }
+    return ts.forEachChild(node, visit);
+  }
+
+  visit(sourceFile);
+  return exports;
+}
+
+type ExportKind =
+  | 'type'
+  | 'interface'
+  | 'enum'
+  | 'function'
+  | 'const'
+  | 'let'
+  | 'var'
+  | 'class';
+type DeclarationOccurrence = { kind: ExportKind; name: string };
+type FileExports = Array<{
+  file: string;
+  exports: DeclarationOccurrence[];
+}>;
+
+function findAllExports(directoryPath: string): FileExports {
+  const results: FileExports = [];
+
+  const files = getTypeScriptFiles(directoryPath);
+
+  for (const file of files) {
+    const sourceFile = ts.createSourceFile(
+      file,
+      fs.readFileSync(file, 'utf8'),
+      ts.ScriptTarget.Latest,
+      true,
+    );
+
+    const exports = extractExportsFromSourceFile(sourceFile);
+    if (exports.length > 0) {
+      results.push({
+        file,
+        exports,
+      });
+    }
+  }
+
+  return results;
+}
+
+type ExportByBarrel = {
+  barrel: {
+    moduleName: string;
+    moduleDirectory: string;
+  };
+  allFileExports: FileExports;
+};
+const retrieveExportsByBarrel = (barrelDirectories: string[]) => {
+  return barrelDirectories.map<ExportByBarrel>((moduleDirectory) => {
+    const moduleExportsPerFile = findAllExports(moduleDirectory);
+    const moduleName = getLastPathFolder(moduleDirectory);
+    if (!moduleName) {
+      throw new Error(
+        `Should never occur moduleName not found ${moduleDirectory}`,
+      );
+    }
+
+    return {
+      barrel: {
+        moduleName,
+        moduleDirectory,
+      },
+      allFileExports: moduleExportsPerFile,
+    };
+  });
+};
+
+const main = () => {
+  const moduleDirectories = getSubDirectoryPaths(SRC_PATH);
+  const exportsByBarrel = retrieveExportsByBarrel(moduleDirectories);
+  const moduleIndexFiles = generateModuleIndexFiles(exportsByBarrel);
+  const packageJsonConfig =
+    computePackageJsonFilesAndExportsConfig(moduleDirectories);
+  const nxBuildOutputsPath =
+    computeProjectNxBuildOutputsPath(moduleDirectories);
+
+  updateNxProjectConfigurationBuildOutputs(nxBuildOutputsPath);
+  writeInPackageJson(packageJsonConfig);
+  moduleIndexFiles.forEach(createTypeScriptFile);
+};
+main();
diff --git a/packages/twenty-new-ui/scripts/visual-diff.sh b/packages/twenty-new-ui/scripts/visual-diff.sh
new file mode 100755
index 00000000000..4d14ea6c55d
--- /dev/null
+++ b/packages/twenty-new-ui/scripts/visual-diff.sh
@@ -0,0 +1,49 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")/.." && pwd)"
+if [[ -f "$SCRIPT_DIR/.env" ]]; then
+  set -a
+  source "$SCRIPT_DIR/.env"
+  set +a
+fi
+
+ARGOS_API_BASE_URL="${ARGOS_API_BASE_URL:-http://127.0.0.1:4002/v2/}"
+ARGOS_TOKEN="${ARGOS_TOKEN:?ARGOS_TOKEN is required – set it in packages/twenty-new-ui/.env}"
+
+USERNAME=$(whoami)
+GIT_BRANCH="${ARGOS_BRANCH:-$(git rev-parse --abbrev-ref HEAD 2>/dev/null || echo "unknown")}"
+COMMIT="${ARGOS_COMMIT:-$(git rev-parse HEAD 2>/dev/null || echo "unknown")}"
+REFERENCE_COMMIT="${ARGOS_REFERENCE_COMMIT:-$(git merge-base HEAD main 2>/dev/null || echo "")}"
+
+export ARGOS_API_BASE_URL
+export ARGOS_TOKEN
+export ARGOS_BUILD_NAME="${USERNAME}/twenty-new-ui"
+export ARGOS_BRANCH="${USERNAME}/${GIT_BRANCH}"
+export ARGOS_COMMIT="$COMMIT"
+export ARGOS_REFERENCE_COMMIT="${REFERENCE_COMMIT}"
+
+echo "Argos visual diff"
+echo "  API:        $ARGOS_API_BASE_URL"
+echo "  Build name: $ARGOS_BUILD_NAME"
+echo "  Branch:     $ARGOS_BRANCH"
+echo "  Commit:     ${ARGOS_COMMIT:0:12}"
+echo "  Ref commit: ${ARGOS_REFERENCE_COMMIT:0:12}"
+echo ""
+
+npx http-server storybook-static --port 6007 --silent &
+HTTP_PID=$!
+trap "kill $HTTP_PID 2>/dev/null || true" EXIT
+
+SERVER_UP=false
+for i in $(seq 1 30); do
+  if curl -sf http://localhost:6007 > /dev/null 2>&1; then SERVER_UP=true; break; fi
+  sleep 1
+done
+if [[ "$SERVER_UP" != "true" ]]; then
+  echo "Storybook static server did not start on http://localhost:6007 after 30s" >&2
+  exit 1
+fi
+
+export STORYBOOK_URL="http://localhost:6007"
+npx vitest run
diff --git a/packages/twenty-new-ui/setupTests.ts b/packages/twenty-new-ui/setupTests.ts
new file mode 100644
index 00000000000..8f2609b7b3e
--- /dev/null
+++ b/packages/twenty-new-ui/setupTests.ts
@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';
diff --git a/packages/twenty-new-ui/src/accessibility/index.ts b/packages/twenty-new-ui/src/accessibility/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/accessibility/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/assets/index.ts b/packages/twenty-new-ui/src/assets/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/assets/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/components/index.ts b/packages/twenty-new-ui/src/components/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/components/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/display/index.ts b/packages/twenty-new-ui/src/display/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/display/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/feedback/index.ts b/packages/twenty-new-ui/src/feedback/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/feedback/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/global.d.ts b/packages/twenty-new-ui/src/global.d.ts
new file mode 100644
index 00000000000..e7b65519422
--- /dev/null
+++ b/packages/twenty-new-ui/src/global.d.ts
@@ -0,0 +1,7 @@
+declare global {
+  interface Window {
+    _env_?: Record<string, string>;
+  }
+}
+
+export {};
diff --git a/packages/twenty-new-ui/src/index.ts b/packages/twenty-new-ui/src/index.ts
new file mode 100644
index 00000000000..d0de71b2ae4
--- /dev/null
+++ b/packages/twenty-new-ui/src/index.ts
@@ -0,0 +1,4 @@
+// Side-effect import: the reset must ship exactly once in the aggregated style.css.
+import './styles/base/reset.scss';
+
+export {};
diff --git a/packages/twenty-new-ui/src/individual-entry.ts b/packages/twenty-new-ui/src/individual-entry.ts
new file mode 100644
index 00000000000..2702c9d8db3
--- /dev/null
+++ b/packages/twenty-new-ui/src/individual-entry.ts
@@ -0,0 +1,15 @@
+// Entry point for the individual/self-contained build (vite.config.individual.ts).
+// Re-exports all public modules so a single bundle contains every component with
+// internal deps bundled, while React stays external for the consumer's bundler.
+
+export * from './accessibility';
+export * from './components';
+export * from './display';
+export * from './feedback';
+export * from './input';
+export * from './json-visualizer';
+export * from './layout';
+export * from './navigation';
+export * from './theme';
+export * from './theme-constants';
+export * from './utilities';
diff --git a/packages/twenty-new-ui/src/input/components/Toggle.module.scss b/packages/twenty-new-ui/src/input/components/Toggle.module.scss
new file mode 100644
index 00000000000..953059a3893
--- /dev/null
+++ b/packages/twenty-new-ui/src/input/components/Toggle.module.scss
@@ -0,0 +1,64 @@
+.root {
+  position: relative;
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  align-self: flex-start;
+  border-radius: 10px;
+  background-color: var(--t-background-transparent-medium);
+  cursor: pointer;
+  transition: background-color duration(normal) ease;
+
+  &[data-checked] {
+    background-color: var(--toggle-on-color, var(--t-color-blue));
+  }
+
+  &[data-disabled] {
+    opacity: 0.5;
+    pointer-events: none;
+  }
+}
+
+.centered {
+  align-self: center;
+}
+
+.small {
+  width: 24px;
+  height: 16px;
+}
+
+.medium {
+  width: 32px;
+  height: 20px;
+}
+
+.thumb {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  display: block;
+  border-radius: 50%;
+  background-color: var(--t-background-primary);
+  transition: transform duration(normal) ease;
+}
+
+.small .thumb {
+  width: 12px;
+  height: 12px;
+  transform: translate(2px, -50%);
+}
+
+.medium .thumb {
+  width: 16px;
+  height: 16px;
+  transform: translate(2px, -50%);
+}
+
+.small[data-checked] .thumb {
+  transform: translate(10px, -50%);
+}
+
+.medium[data-checked] .thumb {
+  transform: translate(14px, -50%);
+}
diff --git a/packages/twenty-new-ui/src/input/components/Toggle.module.scss.d.ts b/packages/twenty-new-ui/src/input/components/Toggle.module.scss.d.ts
new file mode 100644
index 00000000000..f2dd624e35d
--- /dev/null
+++ b/packages/twenty-new-ui/src/input/components/Toggle.module.scss.d.ts
@@ -0,0 +1,8 @@
+declare const classNames: {
+  readonly root: 'root';
+  readonly centered: 'centered';
+  readonly small: 'small';
+  readonly medium: 'medium';
+  readonly thumb: 'thumb';
+};
+export default classNames;
diff --git a/packages/twenty-new-ui/src/input/components/Toggle.stories.tsx b/packages/twenty-new-ui/src/input/components/Toggle.stories.tsx
new file mode 100644
index 00000000000..e6d4dddb70f
--- /dev/null
+++ b/packages/twenty-new-ui/src/input/components/Toggle.stories.tsx
@@ -0,0 +1,50 @@
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import { useState } from 'react';
+
+import { ThemeProvider } from '@new-ui/theme-constants';
+
+import { Toggle } from './Toggle';
+
+const meta: Meta<typeof Toggle> = {
+  title: 'Input/Toggle',
+  component: Toggle,
+  args: { toggleSize: 'medium', 'aria-label': 'Example toggle' },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Toggle>;
+
+export const On: Story = { args: { value: true } };
+
+export const Off: Story = { args: { value: false } };
+
+export const Small: Story = { args: { value: true, toggleSize: 'small' } };
+
+export const CustomColor: Story = {
+  args: { value: true, color: 'color(display-p3 0.2 0.7 0.4)' },
+};
+
+export const Disabled: Story = { args: { value: true, disabled: true } };
+
+const ControlledToggle = () => {
+  const [value, setValue] = useState(false);
+  return (
+    <Toggle value={value} onChange={setValue} aria-label="Example toggle" />
+  );
+};
+
+export const Interactive: Story = {
+  render: () => <ControlledToggle />,
+};
+
+export const Dark: Story = {
+  args: { value: true },
+  decorators: [
+    (Story) => (
+      <ThemeProvider colorScheme="dark">
+        <Story />
+      </ThemeProvider>
+    ),
+  ],
+};
diff --git a/packages/twenty-new-ui/src/input/components/Toggle.tsx b/packages/twenty-new-ui/src/input/components/Toggle.tsx
new file mode 100644
index 00000000000..7323f78cabf
--- /dev/null
+++ b/packages/twenty-new-ui/src/input/components/Toggle.tsx
@@ -0,0 +1,54 @@
+import { Switch } from '@base-ui/react/switch';
+import { clsx } from 'clsx';
+
+import styles from './Toggle.module.scss';
+
+export type ToggleSize = 'small' | 'medium';
+
+export type ToggleProps = {
+  id?: string;
+  value?: boolean;
+  onChange?: (value: boolean, e?: React.MouseEvent<HTMLDivElement>) => void;
+  color?: string;
+  toggleSize?: ToggleSize;
+  className?: string;
+  centered?: boolean;
+  disabled?: boolean;
+  'aria-label'?: string;
+  'aria-labelledby'?: string;
+};
+
+export const Toggle = ({
+  id,
+  value = false,
+  onChange,
+  color,
+  toggleSize = 'medium',
+  className,
+  centered,
+  disabled,
+  'aria-label': ariaLabel,
+  'aria-labelledby': ariaLabelledBy,
+}: ToggleProps) => (
+  <Switch.Root
+    id={id}
+    checked={value}
+    disabled={disabled}
+    onCheckedChange={(checked) => onChange?.(checked)}
+    aria-label={ariaLabel}
+    aria-labelledby={ariaLabelledBy}
+    className={clsx(
+      styles.root,
+      styles[toggleSize],
+      centered && styles.centered,
+      className,
+    )}
+    style={
+      color
+        ? ({ '--toggle-on-color': color } as React.CSSProperties)
+        : undefined
+    }
+  >
+    <Switch.Thumb className={styles.thumb} />
+  </Switch.Root>
+);
diff --git a/packages/twenty-new-ui/src/input/index.ts b/packages/twenty-new-ui/src/input/index.ts
new file mode 100644
index 00000000000..41341f72445
--- /dev/null
+++ b/packages/twenty-new-ui/src/input/index.ts
@@ -0,0 +1,2 @@
+export { Toggle } from './components/Toggle';
+export type { ToggleProps, ToggleSize } from './components/Toggle';
diff --git a/packages/twenty-new-ui/src/json-visualizer/index.ts b/packages/twenty-new-ui/src/json-visualizer/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/json-visualizer/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/layout/index.ts b/packages/twenty-new-ui/src/layout/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/layout/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/navigation/index.ts b/packages/twenty-new-ui/src/navigation/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/navigation/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/styles/abstracts/_breakpoints.scss b/packages/twenty-new-ui/src/styles/abstracts/_breakpoints.scss
new file mode 100644
index 00000000000..cbad596cdcd
--- /dev/null
+++ b/packages/twenty-new-ui/src/styles/abstracts/_breakpoints.scss
@@ -0,0 +1,18 @@
+@use 'sass:map';
+
+// Mirrors twenty-ui's MOBILE_VIEWPORT (768px).
+$breakpoints: (
+  'mobile': 768px,
+);
+
+@mixin respond-to($name) {
+  $value: map.get($breakpoints, $name);
+
+  @if $value == null {
+    @error 'Unknown breakpoint: #{$name}';
+  }
+
+  @media (max-width: $value) {
+    @content;
+  }
+}
diff --git a/packages/twenty-new-ui/src/styles/abstracts/_functions.scss b/packages/twenty-new-ui/src/styles/abstracts/_functions.scss
new file mode 100644
index 00000000000..bf852fd966c
--- /dev/null
+++ b/packages/twenty-new-ui/src/styles/abstracts/_functions.scss
@@ -0,0 +1,5 @@
+// duration(fast) => calc(var(--t-animation-duration-fast) * 1s)
+// Theme animation durations are stored unitless; this scales them to seconds.
+@function duration($name) {
+  @return calc(var(--t-animation-duration-#{$name}) * 1s);
+}
diff --git a/packages/twenty-new-ui/src/styles/abstracts/_mixins.scss b/packages/twenty-new-ui/src/styles/abstracts/_mixins.scss
new file mode 100644
index 00000000000..e6619782b8f
--- /dev/null
+++ b/packages/twenty-new-ui/src/styles/abstracts/_mixins.scss
@@ -0,0 +1,6 @@
+@mixin focus-ring {
+  &:focus-visible {
+    outline: 2px solid var(--t-color-blue);
+    outline-offset: 1px;
+  }
+}
diff --git a/packages/twenty-new-ui/src/styles/base/reset.scss b/packages/twenty-new-ui/src/styles/base/reset.scss
new file mode 100644
index 00000000000..2ba2a180bf6
--- /dev/null
+++ b/packages/twenty-new-ui/src/styles/base/reset.scss
@@ -0,0 +1,15 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+button {
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  color: inherit;
+  background: none;
+  border: none;
+  cursor: pointer;
+}
diff --git a/packages/twenty-new-ui/src/testing/index.ts b/packages/twenty-new-ui/src/testing/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/testing/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/theme-constants/ThemeProvider.tsx b/packages/twenty-new-ui/src/theme-constants/ThemeProvider.tsx
new file mode 100644
index 00000000000..3bfa3d79d7e
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/ThemeProvider.tsx
@@ -0,0 +1,121 @@
+import { createContext, useLayoutEffect, useState } from 'react';
+
+import { themeCssVariables } from './themeCssVariables';
+
+type StringLeaves<T> = {
+  [K in keyof T]: T[K] extends string ? string : StringLeaves<T[K]>;
+};
+
+type DeepMerge<T, U> = {
+  [K in keyof T]: K extends keyof U
+    ? U[K] extends Record<string, unknown>
+      ? T[K] extends Record<string, unknown>
+        ? DeepMerge<T[K], U[K]>
+        : U[K]
+      : U[K]
+    : T[K];
+};
+
+// CSS variables that resolve to pure numbers at runtime
+type NumericOverrides = {
+  icon: {
+    size: { sm: number; md: number; lg: number; xl: number };
+    stroke: { sm: number; md: number; lg: number };
+  };
+  animation: {
+    duration: { instant: number; fast: number; normal: number; slow: number };
+  };
+  text: {
+    lineHeight: { lg: number; md: number };
+    iconSizeMedium: number;
+    iconSizeSmall: number;
+    iconStrikeLight: number;
+    iconStrikeMedium: number;
+    iconStrikeBold: number;
+  };
+  spacingMultiplicator: number;
+  lastLayerZIndex: number;
+};
+
+export type ThemeType = DeepMerge<
+  StringLeaves<typeof themeCssVariables>,
+  NumericOverrides
+>;
+
+export type ThemeContextType = {
+  theme: ThemeType;
+  colorScheme: 'light' | 'dark';
+};
+
+const computeThemeFromCss = (): ThemeType => {
+  if (
+    typeof document === 'undefined' ||
+    typeof getComputedStyle !== 'function'
+  ) {
+    return themeCssVariables as unknown as ThemeType;
+  }
+
+  const computedStyle = getComputedStyle(document.documentElement);
+
+  const resolve = (obj: Record<string, unknown>): Record<string, unknown> => {
+    const result: Record<string, unknown> = {};
+
+    for (const key of Object.keys(obj)) {
+      const value = obj[key];
+
+      if (typeof value === 'string' && value.startsWith('var(')) {
+        const varName = value.slice(4, -1);
+        const raw = computedStyle.getPropertyValue(varName).trim();
+        const num = Number(raw);
+        result[key] = raw !== '' && !isNaN(num) ? num : raw;
+      } else if (typeof value === 'object' && value !== null) {
+        result[key] = resolve(value as Record<string, unknown>);
+      } else {
+        result[key] = value;
+      }
+    }
+
+    return result;
+  };
+
+  return resolve(
+    themeCssVariables as unknown as Record<string, unknown>,
+  ) as unknown as ThemeType;
+};
+
+const applyColorSchemeClass = (colorScheme: 'light' | 'dark') => {
+  if (typeof document === 'undefined') return;
+  const root = document.documentElement;
+  if (!root?.classList) return;
+  root.classList.toggle('dark', colorScheme === 'dark');
+  root.classList.toggle('light', colorScheme === 'light');
+};
+
+export const ThemeContext = createContext<ThemeContextType>({
+  theme: themeCssVariables as unknown as ThemeType,
+  colorScheme: 'light',
+});
+
+export const ThemeProvider = ({
+  children,
+  colorScheme,
+}: {
+  children: React.ReactNode;
+  colorScheme: 'light' | 'dark';
+}) => {
+  const [theme, setTheme] = useState<ThemeType>(() => {
+    applyColorSchemeClass(colorScheme);
+    return computeThemeFromCss();
+  });
+
+  useLayoutEffect(() => {
+    applyColorSchemeClass(colorScheme);
+    setTheme(computeThemeFromCss());
+  }, [colorScheme]);
+
+  return (
+    <ThemeContext.Provider value={{ theme, colorScheme }}>
+      {children}
+    </ThemeContext.Provider>
+  );
+};
diff --git a/packages/twenty-new-ui/src/theme-constants/__tests__/getNextThemeColor.test.ts b/packages/twenty-new-ui/src/theme-constants/__tests__/getNextThemeColor.test.ts
new file mode 100644
index 00000000000..d1e316dccbd
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/__tests__/getNextThemeColor.test.ts
@@ -0,0 +1,28 @@
+import {
+  MAIN_COLOR_NAMES,
+  type ThemeColor,
+} from '@new-ui/theme/constants/MainColorNames';
+
+import { getNextThemeColor } from '../getNextThemeColor';
+
+describe('getNextThemeColor', () => {
+  it('returns the next theme color', () => {
+    const currentColor: ThemeColor = MAIN_COLOR_NAMES[0];
+    const nextColor: ThemeColor = MAIN_COLOR_NAMES[1];
+
+    expect(getNextThemeColor(MAIN_COLOR_NAMES, currentColor)).toBe(nextColor);
+  });
+
+  it('returns the first color when reaching the end', () => {
+    const currentColor: ThemeColor =
+      MAIN_COLOR_NAMES[MAIN_COLOR_NAMES.length - 1];
+    const nextColor: ThemeColor = MAIN_COLOR_NAMES[0];
+
+    expect(getNextThemeColor(MAIN_COLOR_NAMES, currentColor)).toBe(nextColor);
+  });
+  it('returns the first color when currentColorIsUndefined', () => {
+    const firstColor: ThemeColor = MAIN_COLOR_NAMES[0];
+
+    expect(getNextThemeColor(MAIN_COLOR_NAMES, undefined)).toBe(firstColor);
+  });
+});
diff --git a/packages/twenty-new-ui/src/theme-constants/__tests__/theme-parity.test.ts b/packages/twenty-new-ui/src/theme-constants/__tests__/theme-parity.test.ts
new file mode 100644
index 00000000000..1aad4866495
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/__tests__/theme-parity.test.ts
@@ -0,0 +1,50 @@
+import { readFileSync } from 'fs';
+import { resolve } from 'path';
+
+import { themeCssVariables as newThemeCssVariables } from '../themeCssVariables';
+import { themeCssVariables as oldThemeCssVariables } from '../../../../twenty-ui/src/theme-constants/themeCssVariables';
+
+const NEW_DIR = resolve(__dirname, '..');
+const OLD_DIR = resolve(__dirname, '../../../../twenty-ui/src/theme-constants');
+
+// Parse a theme CSS file into ordered [name, value] pairs, normalizing
+// whitespace so formatting differences (multi-line vs single-line values,
+// header comment) don't affect the comparison. Stops each value at the ';'
+// that terminates it, skipping ';' embedded in values (e.g. data URIs).
+const parseTokens = (dir: string, file: string): [string, string][] => {
+  const text = readFileSync(resolve(dir, file), 'utf8');
+  const body = text.slice(text.indexOf('{') + 1, text.lastIndexOf('}'));
+  const re = /--t-([a-z0-9_-]+):\s*([\s\S]*?);(?=\s*(?:--t-|$))/g;
+  const tokens: [string, string][] = [];
+  let match: RegExpExecArray | null;
+  while ((match = re.exec(body)) !== null) {
+    const value = match[2]
+      .trim()
+      .replace(/\s+/g, ' ')
+      .replace(/\(\s+/g, '(')
+      .replace(/\s+\)/g, ')');
+    tokens.push([match[1], value]);
+  }
+  return tokens;
+};
+
+// twenty-new-ui must produce the exact same --t-* tokens and values (and order)
+// as twenty-ui, so the swap is token-for-token with no visual change.
+// Comparison ignores incidental formatting (header, whitespace) but not values.
+describe('theme parity with twenty-ui', () => {
+  it('theme-light.css tokens match twenty-ui', () => {
+    expect(parseTokens(NEW_DIR, 'theme-light.css')).toEqual(
+      parseTokens(OLD_DIR, 'theme-light.css'),
+    );
+  });
+
+  it('theme-dark.css tokens match twenty-ui', () => {
+    expect(parseTokens(NEW_DIR, 'theme-dark.css')).toEqual(
+      parseTokens(OLD_DIR, 'theme-dark.css'),
+    );
+  });
+
+  it('themeCssVariables is deeply equal to twenty-ui', () => {
+    expect(newThemeCssVariables).toEqual(oldThemeCssVariables);
+  });
+});
diff --git a/packages/twenty-new-ui/src/theme-constants/constants.ts b/packages/twenty-new-ui/src/theme-constants/constants.ts
new file mode 100644
index 00000000000..25092372eda
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/constants.ts
@@ -0,0 +1,3 @@
+// CSS custom properties don't work in media queries, so MOBILE_VIEWPORT
+// must be a static number rather than a var(--...) reference.
+export const MOBILE_VIEWPORT = 768;
diff --git a/packages/twenty-new-ui/src/theme-constants/getNextThemeColor.ts b/packages/twenty-new-ui/src/theme-constants/getNextThemeColor.ts
new file mode 100644
index 00000000000..ce8dfdc8e02
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/getNextThemeColor.ts
@@ -0,0 +1,15 @@
+import { type ThemeColor } from '@new-ui/theme/constants/MainColorNames';
+
+export const getNextThemeColor = (
+  colorNames: ThemeColor[],
+  currentColor?: ThemeColor,
+): ThemeColor => {
+  if (currentColor === null || currentColor === undefined) {
+    return colorNames[0];
+  }
+  const currentColorIndex = colorNames.findIndex(
+    (color) => color === currentColor,
+  );
+  const nextColorIndex = (currentColorIndex + 1) % colorNames.length;
+  return colorNames[nextColorIndex];
+};
diff --git a/packages/twenty-new-ui/src/theme-constants/index.ts b/packages/twenty-new-ui/src/theme-constants/index.ts
new file mode 100644
index 00000000000..7e804abdedf
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/index.ts
@@ -0,0 +1,14 @@
+/*
+ * _____                    _
+ *|_   _|_      _____ _ __ | |_ _   _
+ *  | | \ \ /\ / / _ \ '_ \| __| | | | Auto-generated file
+ *  | |  \ V  V /  __/ | | | |_| |_| | Any edits to this will be overridden
+ *  |_|   \_/\_/ \___|_| |_|\__|\__, |
+ *                              |___/
+ */
+
+export { MOBILE_VIEWPORT } from './constants';
+export { getNextThemeColor } from './getNextThemeColor';
+export { themeCssVariables } from './themeCssVariables';
+export type { ThemeType, ThemeContextType } from './ThemeProvider';
+export { ThemeContext, ThemeProvider } from './ThemeProvider';
diff --git a/packages/twenty-new-ui/src/theme-constants/theme-dark.css b/packages/twenty-new-ui/src/theme-constants/theme-dark.css
new file mode 100644
index 00000000000..13f94f5845c
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/theme-dark.css
@@ -0,0 +1,1007 @@
+/* Theme CSS variables, mirrored token-for-token from twenty-ui.
+   Kept in sync by the theme parity test (src/theme-constants/__tests__). */
+
+.dark {
+  --t-icon-size-sm: 14;
+  --t-icon-size-md: 16;
+  --t-icon-size-lg: 20;
+  --t-icon-size-xl: 24;
+  --t-icon-stroke-sm: 1.6;
+  --t-icon-stroke-md: 2;
+  --t-icon-stroke-lg: 2.5;
+  --t-modal-size-sm-width: 300px;
+  --t-modal-size-md-width: 400px;
+  --t-modal-size-lg-width: 53%;
+  --t-modal-size-xl-width: 1200px;
+  --t-modal-size-xl-height: 800px;
+  --t-modal-size-fullscreen-width: 100dvw;
+  --t-modal-size-fullscreen-height: 100dvh;
+  --t-text-line-height-lg: 1.5;
+  --t-text-line-height-md: 1.1;
+  --t-text-icon-size-medium: 16;
+  --t-text-icon-size-small: 14;
+  --t-text-icon-strike-light: 1.6;
+  --t-text-icon-strike-medium: 2;
+  --t-text-icon-strike-bold: 2.5;
+  --t-animation-duration-instant: 0.075;
+  --t-animation-duration-fast: 0.15;
+  --t-animation-duration-normal: 0.3;
+  --t-animation-duration-slow: 1.5;
+  --t-spacing-multiplicator: 4;
+  --t-spacing-0: 0px;
+  --t-spacing-1: 4px;
+  --t-spacing-2: 8px;
+  --t-spacing-3: 12px;
+  --t-spacing-4: 16px;
+  --t-spacing-5: 20px;
+  --t-spacing-6: 24px;
+  --t-spacing-7: 28px;
+  --t-spacing-8: 32px;
+  --t-spacing-9: 36px;
+  --t-spacing-10: 40px;
+  --t-spacing-11: 44px;
+  --t-spacing-12: 48px;
+  --t-spacing-13: 52px;
+  --t-spacing-14: 56px;
+  --t-spacing-15: 60px;
+  --t-spacing-16: 64px;
+  --t-spacing-17: 68px;
+  --t-spacing-18: 72px;
+  --t-spacing-19: 76px;
+  --t-spacing-20: 80px;
+  --t-spacing-21: 84px;
+  --t-spacing-22: 88px;
+  --t-spacing-23: 92px;
+  --t-spacing-24: 96px;
+  --t-spacing-25: 100px;
+  --t-spacing-26: 104px;
+  --t-spacing-27: 108px;
+  --t-spacing-28: 112px;
+  --t-spacing-29: 116px;
+  --t-spacing-30: 120px;
+  --t-spacing-31: 124px;
+  --t-spacing-32: 128px;
+  --t-spacing-0_5: 2px;
+  --t-spacing-1_5: 6px;
+  --t-between-siblings-gap: 2px;
+  --t-table-horizontal-cell-margin: 8px;
+  --t-table-checkbox-column-width: 32px;
+  --t-table-horizontal-cell-padding: 8px;
+  --t-side-panel-width: 500px;
+  --t-clickable-element-background-transition: background 0.1s ease;
+  --t-last-layer-z-index: 2147483647;
+  --t-buttons-secondary-text-color: color(display-p3 0.63 0.69 1);
+  --t-accent-primary: color(display-p3 0.163 0.22 0.439);
+  --t-accent-secondary: color(display-p3 0.163 0.22 0.439);
+  --t-accent-tertiary: color(display-p3 0.105 0.141 0.275);
+  --t-accent-quaternary: color(display-p3 0.081 0.089 0.144);
+  --t-accent-accent3570: color(display-p3 0.285 0.362 0.674);
+  --t-accent-accent4060: color(display-p3 0.285 0.362 0.674);
+  --t-accent-accent1: color(display-p3 0.068 0.074 0.118);
+  --t-accent-accent2: color(display-p3 0.081 0.089 0.144);
+  --t-accent-accent3: color(display-p3 0.105 0.141 0.275);
+  --t-accent-accent4: color(display-p3 0.129 0.18 0.369);
+  --t-accent-accent5: color(display-p3 0.163 0.22 0.439);
+  --t-accent-accent6: color(display-p3 0.203 0.262 0.5);
+  --t-accent-accent7: color(display-p3 0.245 0.309 0.575);
+  --t-accent-accent8: color(display-p3 0.285 0.362 0.674);
+  --t-accent-accent9: color(display-p3 0.276 0.384 0.837);
+  --t-accent-accent10: color(display-p3 0.354 0.445 0.866);
+  --t-accent-accent11: color(display-p3 0.63 0.69 1);
+  --t-accent-accent12: color(display-p3 0.848 0.881 0.99);
+  --t-background-noisy: url(data:image/jpeg;base64,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);
+  --t-background-primary: color(display-p3 0.09 0.09 0.09);
+  --t-background-secondary: color(display-p3 0.106 0.106 0.106);
+  --t-background-tertiary: color(display-p3 0.114 0.114 0.114);
+  --t-background-quaternary: color(display-p3 0.133 0.133 0.133);
+  --t-background-inverted-primary: color(display-p3 0.922 0.922 0.922);
+  --t-background-inverted-secondary: color(display-p3 0.702 0.702 0.702);
+  --t-background-danger: color(display-p3 0.211 0.081 0.099);
+  --t-background-transparent-primary: color(display-p3 0 0 0 / 0.5);
+  --t-background-transparent-secondary: color(display-p3 0 0 0 / 0.4);
+  --t-background-transparent-strong: color(display-p3 1 1 1 / 0.141);
+  --t-background-transparent-medium: color(display-p3 1 1 1 / 0.102);
+  --t-background-transparent-light: color(display-p3 1 1 1 / 0.059);
+  --t-background-transparent-lighter: color(display-p3 1 1 1 / 0.031);
+  --t-background-transparent-danger: #ff173f2d;
+  --t-background-transparent-blue: #3566ff57;
+  --t-background-transparent-orange: #ff590039;
+  --t-background-transparent-success: #11ff992d;
+  --t-background-overlay-primary: #000000b8;
+  --t-background-overlay-secondary: #0000005c;
+  --t-background-overlay-tertiary: #0000005c;
+  --t-background-radial-gradient: radial-gradient(
+    50% 62.62% at 50% 0%,
+    color(display-p3 0.506 0.506 0.506) 0%,
+    color(display-p3 0.482 0.482 0.482) 100%
+  );
+  --t-background-radial-gradient-hover: radial-gradient(
+    76.32% 95.59% at 50% 0%,
+    color(display-p3 0.482 0.482 0.482) 0%,
+    color(display-p3 0.702 0.702 0.702) 100%
+  );
+  --t-background-primary-inverted: color(display-p3 0.922 0.922 0.922);
+  --t-background-primary-inverted-hover: color(display-p3 0.702 0.702 0.702);
+  --t-blur-light: blur(6px) saturate(200%) contrast(100%) brightness(130%);
+  --t-blur-medium: blur(12px) saturate(200%) contrast(100%) brightness(130%);
+  --t-blur-strong: blur(20px) saturate(200%) contrast(100%) brightness(130%);
+  --t-border-color-strong: color(display-p3 0.282 0.282 0.282);
+  --t-border-color-medium: color(display-p3 0.133 0.133 0.133);
+  --t-border-color-light: color(display-p3 0.114 0.114 0.114);
+  --t-border-color-secondary-inverted: color(display-p3 0.702 0.702 0.702);
+  --t-border-color-inverted: color(display-p3 0.922 0.922 0.922);
+  --t-border-color-danger: color(display-p3 0.348 0.11 0.142);
+  --t-border-color-blue: color(display-p3 0.245 0.309 0.575);
+  --t-border-color-transparent-strong: color(display-p3 1 1 1 / 0.071);
+  --t-border-radius-xs: 2px;
+  --t-border-radius-sm: 4px;
+  --t-border-radius-md: 8px;
+  --t-border-radius-xl: 20px;
+  --t-border-radius-xxl: 40px;
+  --t-border-radius-pill: 999px;
+  --t-border-radius-rounded: 100%;
+  --t-box-shadow-color: rgba(0, 0, 0, 0.6);
+  --t-box-shadow-light:
+    0px 2px 4px 0px rgba(0, 0, 0, 0.04), 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
+  --t-box-shadow-strong:
+    2px 4px 16px 0px rgba(0, 0, 0, 0.16), 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
+  --t-box-shadow-underline: 0px 1px 0px 0px rgba(0, 0, 0, 0.32);
+  --t-box-shadow-super-heavy:
+    2px 4px 16px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.04);
+  --t-font-color-primary: color(display-p3 0.922 0.922 0.922);
+  --t-font-color-secondary: color(display-p3 0.702 0.702 0.702);
+  --t-font-color-tertiary: color(display-p3 0.506 0.506 0.506);
+  --t-font-color-light: color(display-p3 0.4 0.4 0.4);
+  --t-font-color-extra-light: color(display-p3 0.298 0.298 0.298);
+  --t-font-color-inverted: color(display-p3 0.09 0.09 0.09);
+  --t-font-color-danger: color(display-p3 0.83 0.329 0.324);
+  --t-font-size-xxs: 0.625rem;
+  --t-font-size-xs: 0.85rem;
+  --t-font-size-sm: 0.92rem;
+  --t-font-size-md: 1rem;
+  --t-font-size-lg: 1.23rem;
+  --t-font-size-xl: 1.54rem;
+  --t-font-size-xxl: 1.85rem;
+  --t-font-weight-regular: 400;
+  --t-font-weight-medium: 500;
+  --t-font-weight-semi-bold: 600;
+  --t-font-family: Inter, sans-serif;
+  --t-name: dark;
+  --t-snack-bar-success-color: color(display-p3 0.297 0.637 0.581);
+  --t-snack-bar-success-background-color: #11ff992d;
+  --t-snack-bar-error-color: color(display-p3 0.83 0.329 0.324);
+  --t-snack-bar-error-background-color: #ff173f2d;
+  --t-snack-bar-warning-color: color(display-p3 0.9 0.45 0.2);
+  --t-snack-bar-warning-background-color: #ff590039;
+  --t-snack-bar-info-color: color(display-p3 0.276 0.384 0.837);
+  --t-snack-bar-info-background-color: #3566ff57;
+  --t-snack-bar-default-color: color(display-p3 0.922 0.922 0.922);
+  --t-snack-bar-default-background-color: color(display-p3 1 1 1 / 0.059);
+  --t-tag-text-gray: color(display-p3 0.702 0.702 0.702);
+  --t-tag-text-mauve: color(display-p3 0.707 0.7 0.735);
+  --t-tag-text-slate: color(display-p3 0.692 0.704 0.728);
+  --t-tag-text-sage: color(display-p3 0.685 0.709 0.697);
+  --t-tag-text-olive: color(display-p3 0.69 0.709 0.682);
+  --t-tag-text-sand: color(display-p3 0.707 0.703 0.68);
+  --t-tag-text-tomato: color(display-p3 1 0.585 0.455);
+  --t-tag-text-red: color(display-p3 1 0.57 0.55);
+  --t-tag-text-ruby: color(display-p3 1 0.57 0.59);
+  --t-tag-text-crimson: color(display-p3 1 0.56 0.66);
+  --t-tag-text-pink: color(display-p3 1 0.535 0.78);
+  --t-tag-text-plum: color(display-p3 0.86 0.602 0.933);
+  --t-tag-text-purple: color(display-p3 0.8 0.62 1);
+  --t-tag-text-violet: color(display-p3 0.72 0.65 1);
+  --t-tag-text-iris: color(display-p3 0.685 0.662 1);
+  --t-tag-text-cyan: color(display-p3 0.446 0.79 0.887);
+  --t-tag-text-turquoise: color(display-p3 0.388 0.835 0.719);
+  --t-tag-text-sky: color(display-p3 0.536 0.772 0.924);
+  --t-tag-text-blue: color(display-p3 0.63 0.69 1);
+  --t-tag-text-jade: color(display-p3 0.4 0.835 0.656);
+  --t-tag-text-green: color(display-p3 0.434 0.828 0.573);
+  --t-tag-text-grass: color(display-p3 0.535 0.807 0.542);
+  --t-tag-text-mint: color(display-p3 0.482 0.825 0.733);
+  --t-tag-text-lime: color(display-p3 0.771 0.893 0.485);
+  --t-tag-text-bronze: color(display-p3 0.81 0.707 0.655);
+  --t-tag-text-gold: color(display-p3 0.784 0.728 0.635);
+  --t-tag-text-brown: color(display-p3 0.835 0.715 0.597);
+  --t-tag-text-orange: color(display-p3 1 0.63 0.38);
+  --t-tag-text-amber: color(display-p3 1 0.8 0.29);
+  --t-tag-text-yellow: color(display-p3 0.948 0.885 0.392);
+  --t-tag-background-gray: color(display-p3 0.098 0.098 0.098);
+  --t-tag-background-mauve: color(display-p3 0.138 0.134 0.144);
+  --t-tag-background-slate: color(display-p3 0.13 0.135 0.145);
+  --t-tag-background-sage: color(display-p3 0.128 0.135 0.131);
+  --t-tag-background-olive: color(display-p3 0.131 0.135 0.126);
+  --t-tag-background-sand: color(display-p3 0.135 0.135 0.129);
+  --t-tag-background-tomato: color(display-p3 0.205 0.097 0.083);
+  --t-tag-background-red: color(display-p3 0.211 0.081 0.099);
+  --t-tag-background-ruby: color(display-p3 0.208 0.088 0.117);
+  --t-tag-background-crimson: color(display-p3 0.203 0.091 0.143);
+  --t-tag-background-pink: color(display-p3 0.198 0.098 0.179);
+  --t-tag-background-plum: color(display-p3 0.192 0.105 0.202);
+  --t-tag-background-purple: color(display-p3 0.175 0.112 0.224);
+  --t-tag-background-violet: color(display-p3 0.154 0.123 0.256);
+  --t-tag-background-iris: color(display-p3 0.128 0.134 0.272);
+  --t-tag-background-cyan: color(display-p3 0.073 0.168 0.209);
+  --t-tag-background-turquoise: color(display-p3 0.087 0.175 0.165);
+  --t-tag-background-sky: color(display-p3 0.089 0.154 0.244);
+  --t-tag-background-blue: color(display-p3 0.105 0.141 0.275);
+  --t-tag-background-jade: color(display-p3 0.091 0.176 0.138);
+  --t-tag-background-green: color(display-p3 0.1 0.173 0.133);
+  --t-tag-background-grass: color(display-p3 0.118 0.163 0.122);
+  --t-tag-background-mint: color(display-p3 0.077 0.17 0.168);
+  --t-tag-background-lime: color(display-p3 0.13 0.16 0.099);
+  --t-tag-background-bronze: color(display-p3 0.147 0.132 0.125);
+  --t-tag-background-gold: color(display-p3 0.141 0.136 0.122);
+  --t-tag-background-brown: color(display-p3 0.151 0.13 0.115);
+  --t-tag-background-orange: color(display-p3 0.189 0.12 0.056);
+  --t-tag-background-amber: color(display-p3 0.178 0.128 0.049);
+  --t-tag-background-yellow: color(display-p3 0.168 0.137 0.039);
+  --t-code-text-gray: color(display-p3 0.482 0.482 0.482);
+  --t-code-text-sky: color(display-p3 0.718 0.925 0.991);
+  --t-code-text-pink: color(display-p3 0.808 0.356 0.645);
+  --t-code-text-orange: color(display-p3 0.601 0.359 0.201);
+  --t-code-text-green: color(display-p3 0.365 0.456 0.25);
+  --t-code-font-family: DM Mono;
+  --t--illustration-icon-color-blue: color(display-p3 0.354 0.445 0.866);
+  --t--illustration-icon-color-gray: color(display-p3 0.4 0.4 0.4);
+  --t--illustration-icon-fill-blue: color(display-p3 0.848 0.881 0.99);
+  --t--illustration-icon-fill-gray: color(display-p3 0.133 0.133 0.133);
+  --t-gray-scale-gray1: color(display-p3 0.09 0.09 0.09);
+  --t-gray-scale-gray2: color(display-p3 0.106 0.106 0.106);
+  --t-gray-scale-gray3: color(display-p3 0.098 0.098 0.098);
+  --t-gray-scale-gray4: color(display-p3 0.114 0.114 0.114);
+  --t-gray-scale-gray5: color(display-p3 0.133 0.133 0.133);
+  --t-gray-scale-gray6: color(display-p3 0.282 0.282 0.282);
+  --t-gray-scale-gray7: color(display-p3 0.298 0.298 0.298);
+  --t-gray-scale-gray8: color(display-p3 0.4 0.4 0.4);
+  --t-gray-scale-gray9: color(display-p3 0.506 0.506 0.506);
+  --t-gray-scale-gray10: color(display-p3 0.482 0.482 0.482);
+  --t-gray-scale-gray11: color(display-p3 0.702 0.702 0.702);
+  --t-gray-scale-gray12: color(display-p3 0.922 0.922 0.922);
+  --t-color-red: color(display-p3 0.83 0.329 0.324);
+  --t-color-ruby: color(display-p3 0.83 0.323 0.408);
+  --t-color-crimson: color(display-p3 0.843 0.298 0.507);
+  --t-color-tomato: color(display-p3 0.831 0.345 0.231);
+  --t-color-orange: color(display-p3 0.9 0.45 0.2);
+  --t-color-amber: color(display-p3 1 0.77 0.26);
+  --t-color-yellow: color(display-p3 1 0.92 0.22);
+  --t-color-lime: color(display-p3 0.78 0.928 0.466);
+  --t-color-grass: color(display-p3 0.38 0.647 0.378);
+  --t-color-green: color(display-p3 0.332 0.634 0.442);
+  --t-color-jade: color(display-p3 0.319 0.63 0.521);
+  --t-color-mint: color(display-p3 0.62 0.908 0.834);
+  --t-color-turquoise: color(display-p3 0.297 0.637 0.581);
+  --t-color-cyan: color(display-p3 0.282 0.627 0.765);
+  --t-color-sky: color(display-p3 0.585 0.877 0.983);
+  --t-color-blue: color(display-p3 0.276 0.384 0.837);
+  --t-color-iris: color(display-p3 0.357 0.357 0.81);
+  --t-color-violet: color(display-p3 0.417 0.341 0.784);
+  --t-color-purple: color(display-p3 0.523 0.318 0.751);
+  --t-color-plum: color(display-p3 0.624 0.313 0.708);
+  --t-color-pink: color(display-p3 0.775 0.297 0.61);
+  --t-color-bronze: color(display-p3 0.611 0.507 0.455);
+  --t-color-gold: color(display-p3 0.579 0.517 0.41);
+  --t-color-brown: color(display-p3 0.651 0.505 0.368);
+  --t-color-gray: color(display-p3 0.298 0.298 0.298);
+  --t-color-yellow1: color(display-p3 0.078 0.069 0.047);
+  --t-color-yellow2: color(display-p3 0.103 0.094 0.063);
+  --t-color-yellow3: color(display-p3 0.168 0.137 0.039);
+  --t-color-yellow4: color(display-p3 0.209 0.169 0);
+  --t-color-yellow5: color(display-p3 0.255 0.209 0);
+  --t-color-yellow6: color(display-p3 0.31 0.261 0.07);
+  --t-color-yellow7: color(display-p3 0.389 0.331 0.135);
+  --t-color-yellow8: color(display-p3 0.497 0.42 0.182);
+  --t-color-yellow9: color(display-p3 1 0.92 0.22);
+  --t-color-yellow10: color(display-p3 1 1 0.456);
+  --t-color-yellow11: color(display-p3 0.948 0.885 0.392);
+  --t-color-yellow12: color(display-p3 0.959 0.934 0.731);
+  --t-color-green1: color(display-p3 0.062 0.083 0.071);
+  --t-color-green2: color(display-p3 0.079 0.106 0.09);
+  --t-color-green3: color(display-p3 0.1 0.173 0.133);
+  --t-color-green4: color(display-p3 0.115 0.229 0.166);
+  --t-color-green5: color(display-p3 0.147 0.282 0.206);
+  --t-color-green6: color(display-p3 0.185 0.338 0.25);
+  --t-color-green7: color(display-p3 0.227 0.403 0.298);
+  --t-color-green8: color(display-p3 0.27 0.479 0.351);
+  --t-color-green9: color(display-p3 0.332 0.634 0.442);
+  --t-color-green10: color(display-p3 0.357 0.682 0.474);
+  --t-color-green11: color(display-p3 0.434 0.828 0.573);
+  --t-color-green12: color(display-p3 0.747 0.938 0.807);
+  --t-color-turquoise1: color(display-p3 0.059 0.083 0.079);
+  --t-color-turquoise2: color(display-p3 0.075 0.11 0.107);
+  --t-color-turquoise3: color(display-p3 0.087 0.175 0.165);
+  --t-color-turquoise4: color(display-p3 0.087 0.227 0.214);
+  --t-color-turquoise5: color(display-p3 0.12 0.277 0.261);
+  --t-color-turquoise6: color(display-p3 0.162 0.335 0.314);
+  --t-color-turquoise7: color(display-p3 0.205 0.406 0.379);
+  --t-color-turquoise8: color(display-p3 0.245 0.489 0.453);
+  --t-color-turquoise9: color(display-p3 0.297 0.637 0.581);
+  --t-color-turquoise10: color(display-p3 0.319 0.69 0.62);
+  --t-color-turquoise11: color(display-p3 0.388 0.835 0.719);
+  --t-color-turquoise12: color(display-p3 0.734 0.934 0.87);
+  --t-color-sky1: color(display-p3 0.056 0.078 0.116);
+  --t-color-sky2: color(display-p3 0.075 0.101 0.149);
+  --t-color-sky3: color(display-p3 0.089 0.154 0.244);
+  --t-color-sky4: color(display-p3 0.106 0.207 0.323);
+  --t-color-sky5: color(display-p3 0.135 0.261 0.394);
+  --t-color-sky6: color(display-p3 0.17 0.322 0.469);
+  --t-color-sky7: color(display-p3 0.205 0.394 0.557);
+  --t-color-sky8: color(display-p3 0.232 0.48 0.665);
+  --t-color-sky9: color(display-p3 0.585 0.877 0.983);
+  --t-color-sky10: color(display-p3 0.718 0.925 0.991);
+  --t-color-sky11: color(display-p3 0.536 0.772 0.924);
+  --t-color-sky12: color(display-p3 0.799 0.947 0.993);
+  --t-color-blue1: color(display-p3 0.068 0.074 0.118);
+  --t-color-blue2: color(display-p3 0.081 0.089 0.144);
+  --t-color-blue3: color(display-p3 0.105 0.141 0.275);
+  --t-color-blue4: color(display-p3 0.129 0.18 0.369);
+  --t-color-blue5: color(display-p3 0.163 0.22 0.439);
+  --t-color-blue6: color(display-p3 0.203 0.262 0.5);
+  --t-color-blue7: color(display-p3 0.245 0.309 0.575);
+  --t-color-blue8: color(display-p3 0.285 0.362 0.674);
+  --t-color-blue9: color(display-p3 0.276 0.384 0.837);
+  --t-color-blue10: color(display-p3 0.354 0.445 0.866);
+  --t-color-blue11: color(display-p3 0.63 0.69 1);
+  --t-color-blue12: color(display-p3 0.848 0.881 0.99);
+  --t-color-purple1: color(display-p3 0.09 0.068 0.103);
+  --t-color-purple2: color(display-p3 0.113 0.082 0.134);
+  --t-color-purple3: color(display-p3 0.175 0.112 0.224);
+  --t-color-purple4: color(display-p3 0.224 0.137 0.297);
+  --t-color-purple5: color(display-p3 0.264 0.167 0.349);
+  --t-color-purple6: color(display-p3 0.311 0.208 0.406);
+  --t-color-purple7: color(display-p3 0.381 0.266 0.496);
+  --t-color-purple8: color(display-p3 0.49 0.349 0.649);
+  --t-color-purple9: color(display-p3 0.523 0.318 0.751);
+  --t-color-purple10: color(display-p3 0.57 0.373 0.791);
+  --t-color-purple11: color(display-p3 0.8 0.62 1);
+  --t-color-purple12: color(display-p3 0.913 0.854 0.971);
+  --t-color-pink1: color(display-p3 0.093 0.068 0.089);
+  --t-color-pink2: color(display-p3 0.121 0.073 0.11);
+  --t-color-pink3: color(display-p3 0.198 0.098 0.179);
+  --t-color-pink4: color(display-p3 0.271 0.095 0.231);
+  --t-color-pink5: color(display-p3 0.32 0.127 0.273);
+  --t-color-pink6: color(display-p3 0.382 0.177 0.326);
+  --t-color-pink7: color(display-p3 0.477 0.238 0.405);
+  --t-color-pink8: color(display-p3 0.612 0.304 0.51);
+  --t-color-pink9: color(display-p3 0.775 0.297 0.61);
+  --t-color-pink10: color(display-p3 0.808 0.356 0.645);
+  --t-color-pink11: color(display-p3 1 0.535 0.78);
+  --t-color-pink12: color(display-p3 0.964 0.826 0.912);
+  --t-color-red1: color(display-p3 0.093 0.068 0.067);
+  --t-color-red2: color(display-p3 0.118 0.077 0.079);
+  --t-color-red3: color(display-p3 0.211 0.081 0.099);
+  --t-color-red4: color(display-p3 0.287 0.079 0.113);
+  --t-color-red5: color(display-p3 0.348 0.11 0.142);
+  --t-color-red6: color(display-p3 0.414 0.16 0.183);
+  --t-color-red7: color(display-p3 0.508 0.224 0.236);
+  --t-color-red8: color(display-p3 0.659 0.298 0.297);
+  --t-color-red9: color(display-p3 0.83 0.329 0.324);
+  --t-color-red10: color(display-p3 0.861 0.403 0.387);
+  --t-color-red11: color(display-p3 1 0.57 0.55);
+  --t-color-red12: color(display-p3 0.971 0.826 0.852);
+  --t-color-orange1: color(display-p3 0.088 0.07 0.057);
+  --t-color-orange2: color(display-p3 0.113 0.089 0.061);
+  --t-color-orange3: color(display-p3 0.189 0.12 0.056);
+  --t-color-orange4: color(display-p3 0.262 0.132 0);
+  --t-color-orange5: color(display-p3 0.315 0.168 0.016);
+  --t-color-orange6: color(display-p3 0.376 0.219 0.088);
+  --t-color-orange7: color(display-p3 0.465 0.283 0.147);
+  --t-color-orange8: color(display-p3 0.601 0.359 0.201);
+  --t-color-orange9: color(display-p3 0.9 0.45 0.2);
+  --t-color-orange10: color(display-p3 0.98 0.51 0.23);
+  --t-color-orange11: color(display-p3 1 0.63 0.38);
+  --t-color-orange12: color(display-p3 0.98 0.883 0.775);
+  --t-color-gray1: color(display-p3 0.09 0.09 0.09);
+  --t-color-gray2: color(display-p3 0.106 0.106 0.106);
+  --t-color-gray3: color(display-p3 0.098 0.098 0.098);
+  --t-color-gray4: color(display-p3 0.114 0.114 0.114);
+  --t-color-gray5: color(display-p3 0.133 0.133 0.133);
+  --t-color-gray6: color(display-p3 0.282 0.282 0.282);
+  --t-color-gray7: color(display-p3 0.298 0.298 0.298);
+  --t-color-gray8: color(display-p3 0.4 0.4 0.4);
+  --t-color-gray9: color(display-p3 0.506 0.506 0.506);
+  --t-color-gray10: color(display-p3 0.482 0.482 0.482);
+  --t-color-gray11: color(display-p3 0.702 0.702 0.702);
+  --t-color-gray12: color(display-p3 0.922 0.922 0.922);
+  --t-color-mauve1: color(display-p3 0.07 0.067 0.074);
+  --t-color-mauve2: color(display-p3 0.101 0.098 0.105);
+  --t-color-mauve3: color(display-p3 0.138 0.134 0.144);
+  --t-color-mauve4: color(display-p3 0.167 0.161 0.175);
+  --t-color-mauve5: color(display-p3 0.196 0.189 0.206);
+  --t-color-mauve6: color(display-p3 0.232 0.225 0.245);
+  --t-color-mauve7: color(display-p3 0.286 0.277 0.302);
+  --t-color-mauve8: color(display-p3 0.383 0.373 0.408);
+  --t-color-mauve9: color(display-p3 0.434 0.428 0.467);
+  --t-color-mauve10: color(display-p3 0.487 0.48 0.519);
+  --t-color-mauve11: color(display-p3 0.707 0.7 0.735);
+  --t-color-mauve12: color(display-p3 0.933 0.933 0.94);
+  --t-color-slate1: color(display-p3 0.067 0.067 0.074);
+  --t-color-slate2: color(display-p3 0.095 0.098 0.105);
+  --t-color-slate3: color(display-p3 0.13 0.135 0.145);
+  --t-color-slate4: color(display-p3 0.156 0.163 0.176);
+  --t-color-slate5: color(display-p3 0.183 0.191 0.206);
+  --t-color-slate6: color(display-p3 0.215 0.226 0.244);
+  --t-color-slate7: color(display-p3 0.265 0.28 0.302);
+  --t-color-slate8: color(display-p3 0.357 0.381 0.409);
+  --t-color-slate9: color(display-p3 0.415 0.431 0.463);
+  --t-color-slate10: color(display-p3 0.469 0.483 0.514);
+  --t-color-slate11: color(display-p3 0.692 0.704 0.728);
+  --t-color-slate12: color(display-p3 0.93 0.933 0.94);
+  --t-color-sage1: color(display-p3 0.064 0.07 0.067);
+  --t-color-sage2: color(display-p3 0.092 0.098 0.094);
+  --t-color-sage3: color(display-p3 0.128 0.135 0.131);
+  --t-color-sage4: color(display-p3 0.155 0.164 0.159);
+  --t-color-sage5: color(display-p3 0.183 0.193 0.188);
+  --t-color-sage6: color(display-p3 0.218 0.23 0.224);
+  --t-color-sage7: color(display-p3 0.269 0.285 0.277);
+  --t-color-sage8: color(display-p3 0.362 0.382 0.373);
+  --t-color-sage9: color(display-p3 0.398 0.438 0.421);
+  --t-color-sage10: color(display-p3 0.453 0.49 0.474);
+  --t-color-sage11: color(display-p3 0.685 0.709 0.697);
+  --t-color-sage12: color(display-p3 0.927 0.933 0.93);
+  --t-color-olive1: color(display-p3 0.067 0.07 0.063);
+  --t-color-olive2: color(display-p3 0.095 0.098 0.091);
+  --t-color-olive3: color(display-p3 0.131 0.135 0.126);
+  --t-color-olive4: color(display-p3 0.158 0.163 0.153);
+  --t-color-olive5: color(display-p3 0.186 0.192 0.18);
+  --t-color-olive6: color(display-p3 0.221 0.229 0.215);
+  --t-color-olive7: color(display-p3 0.273 0.284 0.266);
+  --t-color-olive8: color(display-p3 0.365 0.382 0.359);
+  --t-color-olive9: color(display-p3 0.414 0.438 0.404);
+  --t-color-olive10: color(display-p3 0.467 0.49 0.458);
+  --t-color-olive11: color(display-p3 0.69 0.709 0.682);
+  --t-color-olive12: color(display-p3 0.927 0.933 0.926);
+  --t-color-sand1: color(display-p3 0.067 0.067 0.063);
+  --t-color-sand2: color(display-p3 0.098 0.098 0.094);
+  --t-color-sand3: color(display-p3 0.135 0.135 0.129);
+  --t-color-sand4: color(display-p3 0.164 0.163 0.156);
+  --t-color-sand5: color(display-p3 0.193 0.192 0.183);
+  --t-color-sand6: color(display-p3 0.23 0.229 0.217);
+  --t-color-sand7: color(display-p3 0.285 0.282 0.267);
+  --t-color-sand8: color(display-p3 0.384 0.378 0.357);
+  --t-color-sand9: color(display-p3 0.434 0.428 0.403);
+  --t-color-sand10: color(display-p3 0.487 0.481 0.456);
+  --t-color-sand11: color(display-p3 0.707 0.703 0.68);
+  --t-color-sand12: color(display-p3 0.933 0.933 0.926);
+  --t-color-tomato1: color(display-p3 0.09 0.068 0.067);
+  --t-color-tomato2: color(display-p3 0.115 0.084 0.076);
+  --t-color-tomato3: color(display-p3 0.205 0.097 0.083);
+  --t-color-tomato4: color(display-p3 0.282 0.099 0.077);
+  --t-color-tomato5: color(display-p3 0.339 0.129 0.101);
+  --t-color-tomato6: color(display-p3 0.398 0.179 0.141);
+  --t-color-tomato7: color(display-p3 0.487 0.245 0.194);
+  --t-color-tomato8: color(display-p3 0.629 0.322 0.248);
+  --t-color-tomato9: color(display-p3 0.831 0.345 0.231);
+  --t-color-tomato10: color(display-p3 0.862 0.415 0.298);
+  --t-color-tomato11: color(display-p3 1 0.585 0.455);
+  --t-color-tomato12: color(display-p3 0.959 0.833 0.802);
+  --t-color-ruby1: color(display-p3 0.093 0.068 0.074);
+  --t-color-ruby2: color(display-p3 0.113 0.083 0.089);
+  --t-color-ruby3: color(display-p3 0.208 0.088 0.117);
+  --t-color-ruby4: color(display-p3 0.279 0.092 0.147);
+  --t-color-ruby5: color(display-p3 0.337 0.12 0.18);
+  --t-color-ruby6: color(display-p3 0.401 0.166 0.223);
+  --t-color-ruby7: color(display-p3 0.495 0.224 0.281);
+  --t-color-ruby8: color(display-p3 0.652 0.295 0.359);
+  --t-color-ruby9: color(display-p3 0.83 0.323 0.408);
+  --t-color-ruby10: color(display-p3 0.857 0.392 0.455);
+  --t-color-ruby11: color(display-p3 1 0.57 0.59);
+  --t-color-ruby12: color(display-p3 0.968 0.83 0.88);
+  --t-color-crimson1: color(display-p3 0.093 0.068 0.078);
+  --t-color-crimson2: color(display-p3 0.117 0.078 0.095);
+  --t-color-crimson3: color(display-p3 0.203 0.091 0.143);
+  --t-color-crimson4: color(display-p3 0.277 0.087 0.182);
+  --t-color-crimson5: color(display-p3 0.332 0.115 0.22);
+  --t-color-crimson6: color(display-p3 0.394 0.162 0.268);
+  --t-color-crimson7: color(display-p3 0.489 0.222 0.336);
+  --t-color-crimson8: color(display-p3 0.638 0.289 0.429);
+  --t-color-crimson9: color(display-p3 0.843 0.298 0.507);
+  --t-color-crimson10: color(display-p3 0.864 0.364 0.539);
+  --t-color-crimson11: color(display-p3 1 0.56 0.66);
+  --t-color-crimson12: color(display-p3 0.966 0.834 0.906);
+  --t-color-plum1: color(display-p3 0.09 0.068 0.092);
+  --t-color-plum2: color(display-p3 0.118 0.077 0.121);
+  --t-color-plum3: color(display-p3 0.192 0.105 0.202);
+  --t-color-plum4: color(display-p3 0.25 0.121 0.271);
+  --t-color-plum5: color(display-p3 0.293 0.152 0.319);
+  --t-color-plum6: color(display-p3 0.343 0.198 0.372);
+  --t-color-plum7: color(display-p3 0.424 0.262 0.461);
+  --t-color-plum8: color(display-p3 0.54 0.341 0.595);
+  --t-color-plum9: color(display-p3 0.624 0.313 0.708);
+  --t-color-plum10: color(display-p3 0.666 0.365 0.748);
+  --t-color-plum11: color(display-p3 0.86 0.602 0.933);
+  --t-color-plum12: color(display-p3 0.936 0.836 0.949);
+  --t-color-violet1: color(display-p3 0.077 0.071 0.118);
+  --t-color-violet2: color(display-p3 0.101 0.084 0.141);
+  --t-color-violet3: color(display-p3 0.154 0.123 0.256);
+  --t-color-violet4: color(display-p3 0.191 0.148 0.345);
+  --t-color-violet5: color(display-p3 0.226 0.182 0.396);
+  --t-color-violet6: color(display-p3 0.269 0.223 0.449);
+  --t-color-violet7: color(display-p3 0.326 0.277 0.53);
+  --t-color-violet8: color(display-p3 0.399 0.346 0.656);
+  --t-color-violet9: color(display-p3 0.417 0.341 0.784);
+  --t-color-violet10: color(display-p3 0.477 0.402 0.823);
+  --t-color-violet11: color(display-p3 0.72 0.65 1);
+  --t-color-violet12: color(display-p3 0.883 0.867 0.986);
+  --t-color-iris1: color(display-p3 0.075 0.075 0.114);
+  --t-color-iris2: color(display-p3 0.089 0.086 0.14);
+  --t-color-iris3: color(display-p3 0.128 0.134 0.272);
+  --t-color-iris4: color(display-p3 0.153 0.165 0.382);
+  --t-color-iris5: color(display-p3 0.192 0.201 0.44);
+  --t-color-iris6: color(display-p3 0.239 0.241 0.491);
+  --t-color-iris7: color(display-p3 0.291 0.289 0.565);
+  --t-color-iris8: color(display-p3 0.35 0.345 0.673);
+  --t-color-iris9: color(display-p3 0.357 0.357 0.81);
+  --t-color-iris10: color(display-p3 0.428 0.416 0.843);
+  --t-color-iris11: color(display-p3 0.685 0.662 1);
+  --t-color-iris12: color(display-p3 0.878 0.875 0.986);
+  --t-color-cyan1: color(display-p3 0.053 0.085 0.098);
+  --t-color-cyan2: color(display-p3 0.072 0.105 0.122);
+  --t-color-cyan3: color(display-p3 0.073 0.168 0.209);
+  --t-color-cyan4: color(display-p3 0.063 0.216 0.277);
+  --t-color-cyan5: color(display-p3 0.091 0.267 0.336);
+  --t-color-cyan6: color(display-p3 0.137 0.324 0.4);
+  --t-color-cyan7: color(display-p3 0.186 0.398 0.484);
+  --t-color-cyan8: color(display-p3 0.23 0.496 0.6);
+  --t-color-cyan9: color(display-p3 0.282 0.627 0.765);
+  --t-color-cyan10: color(display-p3 0.331 0.675 0.801);
+  --t-color-cyan11: color(display-p3 0.446 0.79 0.887);
+  --t-color-cyan12: color(display-p3 0.757 0.919 0.962);
+  --t-color-jade1: color(display-p3 0.059 0.083 0.071);
+  --t-color-jade2: color(display-p3 0.078 0.11 0.094);
+  --t-color-jade3: color(display-p3 0.091 0.176 0.138);
+  --t-color-jade4: color(display-p3 0.102 0.228 0.177);
+  --t-color-jade5: color(display-p3 0.133 0.279 0.221);
+  --t-color-jade6: color(display-p3 0.174 0.334 0.273);
+  --t-color-jade7: color(display-p3 0.219 0.402 0.335);
+  --t-color-jade8: color(display-p3 0.263 0.488 0.411);
+  --t-color-jade9: color(display-p3 0.319 0.63 0.521);
+  --t-color-jade10: color(display-p3 0.338 0.68 0.555);
+  --t-color-jade11: color(display-p3 0.4 0.835 0.656);
+  --t-color-jade12: color(display-p3 0.734 0.934 0.838);
+  --t-color-grass1: color(display-p3 0.062 0.083 0.067);
+  --t-color-grass2: color(display-p3 0.083 0.103 0.085);
+  --t-color-grass3: color(display-p3 0.118 0.163 0.122);
+  --t-color-grass4: color(display-p3 0.142 0.225 0.15);
+  --t-color-grass5: color(display-p3 0.178 0.279 0.186);
+  --t-color-grass6: color(display-p3 0.217 0.337 0.224);
+  --t-color-grass7: color(display-p3 0.258 0.4 0.264);
+  --t-color-grass8: color(display-p3 0.302 0.47 0.305);
+  --t-color-grass9: color(display-p3 0.38 0.647 0.378);
+  --t-color-grass10: color(display-p3 0.426 0.694 0.426);
+  --t-color-grass11: color(display-p3 0.535 0.807 0.542);
+  --t-color-grass12: color(display-p3 0.797 0.936 0.776);
+  --t-color-mint1: color(display-p3 0.059 0.082 0.081);
+  --t-color-mint2: color(display-p3 0.068 0.104 0.105);
+  --t-color-mint3: color(display-p3 0.077 0.17 0.168);
+  --t-color-mint4: color(display-p3 0.068 0.224 0.22);
+  --t-color-mint5: color(display-p3 0.104 0.275 0.264);
+  --t-color-mint6: color(display-p3 0.154 0.332 0.313);
+  --t-color-mint7: color(display-p3 0.207 0.403 0.373);
+  --t-color-mint8: color(display-p3 0.258 0.49 0.441);
+  --t-color-mint9: color(display-p3 0.62 0.908 0.834);
+  --t-color-mint10: color(display-p3 0.725 0.954 0.898);
+  --t-color-mint11: color(display-p3 0.482 0.825 0.733);
+  --t-color-mint12: color(display-p3 0.807 0.955 0.887);
+  --t-color-lime1: color(display-p3 0.067 0.073 0.048);
+  --t-color-lime2: color(display-p3 0.086 0.1 0.067);
+  --t-color-lime3: color(display-p3 0.13 0.16 0.099);
+  --t-color-lime4: color(display-p3 0.172 0.214 0.126);
+  --t-color-lime5: color(display-p3 0.213 0.266 0.153);
+  --t-color-lime6: color(display-p3 0.257 0.321 0.182);
+  --t-color-lime7: color(display-p3 0.307 0.383 0.215);
+  --t-color-lime8: color(display-p3 0.365 0.456 0.25);
+  --t-color-lime9: color(display-p3 0.78 0.928 0.466);
+  --t-color-lime10: color(display-p3 0.865 0.995 0.519);
+  --t-color-lime11: color(display-p3 0.771 0.893 0.485);
+  --t-color-lime12: color(display-p3 0.905 0.966 0.753);
+  --t-color-bronze1: color(display-p3 0.076 0.067 0.063);
+  --t-color-bronze2: color(display-p3 0.106 0.097 0.093);
+  --t-color-bronze3: color(display-p3 0.147 0.132 0.125);
+  --t-color-bronze4: color(display-p3 0.185 0.166 0.156);
+  --t-color-bronze5: color(display-p3 0.227 0.202 0.19);
+  --t-color-bronze6: color(display-p3 0.278 0.246 0.23);
+  --t-color-bronze7: color(display-p3 0.343 0.302 0.281);
+  --t-color-bronze8: color(display-p3 0.426 0.374 0.347);
+  --t-color-bronze9: color(display-p3 0.611 0.507 0.455);
+  --t-color-bronze10: color(display-p3 0.66 0.556 0.504);
+  --t-color-bronze11: color(display-p3 0.81 0.707 0.655);
+  --t-color-bronze12: color(display-p3 0.921 0.88 0.854);
+  --t-color-gold1: color(display-p3 0.071 0.071 0.067);
+  --t-color-gold2: color(display-p3 0.104 0.101 0.09);
+  --t-color-gold3: color(display-p3 0.141 0.136 0.122);
+  --t-color-gold4: color(display-p3 0.177 0.17 0.152);
+  --t-color-gold5: color(display-p3 0.217 0.207 0.185);
+  --t-color-gold6: color(display-p3 0.265 0.252 0.225);
+  --t-color-gold7: color(display-p3 0.327 0.31 0.277);
+  --t-color-gold8: color(display-p3 0.407 0.384 0.342);
+  --t-color-gold9: color(display-p3 0.579 0.517 0.41);
+  --t-color-gold10: color(display-p3 0.628 0.566 0.463);
+  --t-color-gold11: color(display-p3 0.784 0.728 0.635);
+  --t-color-gold12: color(display-p3 0.906 0.887 0.855);
+  --t-color-brown1: color(display-p3 0.071 0.067 0.059);
+  --t-color-brown2: color(display-p3 0.107 0.095 0.087);
+  --t-color-brown3: color(display-p3 0.151 0.13 0.115);
+  --t-color-brown4: color(display-p3 0.191 0.161 0.138);
+  --t-color-brown5: color(display-p3 0.235 0.194 0.162);
+  --t-color-brown6: color(display-p3 0.291 0.237 0.192);
+  --t-color-brown7: color(display-p3 0.365 0.295 0.232);
+  --t-color-brown8: color(display-p3 0.469 0.377 0.287);
+  --t-color-brown9: color(display-p3 0.651 0.505 0.368);
+  --t-color-brown10: color(display-p3 0.697 0.557 0.423);
+  --t-color-brown11: color(display-p3 0.835 0.715 0.597);
+  --t-color-brown12: color(display-p3 0.938 0.885 0.802);
+  --t-color-amber1: color(display-p3 0.082 0.07 0.05);
+  --t-color-amber2: color(display-p3 0.111 0.094 0.064);
+  --t-color-amber3: color(display-p3 0.178 0.128 0.049);
+  --t-color-amber4: color(display-p3 0.239 0.156 0);
+  --t-color-amber5: color(display-p3 0.29 0.193 0);
+  --t-color-amber6: color(display-p3 0.344 0.245 0.076);
+  --t-color-amber7: color(display-p3 0.422 0.314 0.141);
+  --t-color-amber8: color(display-p3 0.535 0.399 0.189);
+  --t-color-amber9: color(display-p3 1 0.77 0.26);
+  --t-color-amber10: color(display-p3 1 0.87 0.15);
+  --t-color-amber11: color(display-p3 1 0.8 0.29);
+  --t-color-amber12: color(display-p3 0.984 0.909 0.726);
+  --t-color-transparent-green1: #00de4505;
+  --t-color-transparent-green2: #29f99d0b;
+  --t-color-transparent-green3: #22ff991e;
+  --t-color-transparent-green4: #11ff992d;
+  --t-color-transparent-green5: #2bffa23c;
+  --t-color-transparent-green6: #44ffaa4b;
+  --t-color-transparent-green7: #50fdac5e;
+  --t-color-transparent-green8: #54ffad73;
+  --t-color-transparent-green9: #44ffa49e;
+  --t-color-transparent-green10: #43fea4ab;
+  --t-color-transparent-green11: #46fea5d4;
+  --t-color-transparent-green12: #bbffd7f0;
+  --t-color-transparent-turquoise1: #00deab05;
+  --t-color-transparent-turquoise2: #12fbe60c;
+  --t-color-transparent-turquoise3: #00ffe61e;
+  --t-color-transparent-turquoise4: #00ffe92d;
+  --t-color-transparent-turquoise5: #00ffea3b;
+  --t-color-transparent-turquoise6: #1cffe84b;
+  --t-color-transparent-turquoise7: #2efde85f;
+  --t-color-transparent-turquoise8: #32ffe775;
+  --t-color-transparent-turquoise9: #13ffe49f;
+  --t-color-transparent-turquoise10: #0dffe0ae;
+  --t-color-transparent-turquoise11: #0afed5d6;
+  --t-color-transparent-turquoise12: #b8ffebef;
+  --t-color-transparent-sky1: #0044ff0f;
+  --t-color-transparent-sky2: #1171fb18;
+  --t-color-transparent-sky3: #1184fc33;
+  --t-color-transparent-sky4: #128fff49;
+  --t-color-transparent-sky5: #1c9dfd5d;
+  --t-color-transparent-sky6: #28a5ff72;
+  --t-color-transparent-sky7: #2badfe8b;
+  --t-color-transparent-sky8: #1db2fea9;
+  --t-color-transparent-sky9: #7ce3fffe;
+  --t-color-transparent-sky10: #a8eeff;
+  --t-color-transparent-sky11: #7cd3ffef;
+  --t-color-transparent-sky12: #c2f3ff;
+  --t-color-transparent-blue1: #1133ff0f;
+  --t-color-transparent-blue2: #3354fa17;
+  --t-color-transparent-blue3: #2f62ff3c;
+  --t-color-transparent-blue4: #3566ff57;
+  --t-color-transparent-blue5: #4171fd6b;
+  --t-color-transparent-blue6: #5178fd7c;
+  --t-color-transparent-blue7: #5a7fff90;
+  --t-color-transparent-blue8: #5b81feac;
+  --t-color-transparent-blue9: #4671ffdb;
+  --t-color-transparent-blue10: #5c7efee3;
+  --t-color-transparent-blue11: #9eb1ff;
+  --t-color-transparent-blue12: #d6e1ff;
+  --t-color-transparent-purple1: #b412f90b;
+  --t-color-transparent-purple2: #b744f714;
+  --t-color-transparent-purple3: #c150ff2d;
+  --t-color-transparent-purple4: #bb53fd42;
+  --t-color-transparent-purple5: #be5cfd51;
+  --t-color-transparent-purple6: #c16dfd61;
+  --t-color-transparent-purple7: #c378fd7a;
+  --t-color-transparent-purple8: #c47effa4;
+  --t-color-transparent-purple9: #b661ffc2;
+  --t-color-transparent-purple10: #bc6fffcd;
+  --t-color-transparent-purple11: #d19dff;
+  --t-color-transparent-purple12: #f1ddfffa;
+  --t-color-transparent-pink1: #f412bc09;
+  --t-color-transparent-pink2: #f420bb12;
+  --t-color-transparent-pink3: #fe37cc29;
+  --t-color-transparent-pink4: #fc1ec43f;
+  --t-color-transparent-pink5: #fd35c24e;
+  --t-color-transparent-pink6: #fd51c75f;
+  --t-color-transparent-pink7: #fd62c87b;
+  --t-color-transparent-pink8: #ff68c8a2;
+  --t-color-transparent-pink9: #fe49bcd4;
+  --t-color-transparent-pink10: #ff5cc0dc;
+  --t-color-transparent-pink11: #ff8dcc;
+  --t-color-transparent-pink12: #ffd3ecfd;
+  --t-color-transparent-red1: #f4121209;
+  --t-color-transparent-red2: #f22f3e11;
+  --t-color-transparent-red3: #ff173f2d;
+  --t-color-transparent-red4: #fe0a3b44;
+  --t-color-transparent-red5: #ff204756;
+  --t-color-transparent-red6: #ff3e5668;
+  --t-color-transparent-red7: #ff536184;
+  --t-color-transparent-red8: #ff5d61b0;
+  --t-color-transparent-red9: #fe4e54e4;
+  --t-color-transparent-red10: #ff6465eb;
+  --t-color-transparent-red11: #ff9592;
+  --t-color-transparent-red12: #ffd1d9;
+  --t-color-transparent-orange1: #ec360007;
+  --t-color-transparent-orange2: #fe6d000e;
+  --t-color-transparent-orange3: #fb6a0025;
+  --t-color-transparent-orange4: #ff590039;
+  --t-color-transparent-orange5: #ff61004a;
+  --t-color-transparent-orange6: #fd75045c;
+  --t-color-transparent-orange7: #ff832c75;
+  --t-color-transparent-orange8: #fe84389d;
+  --t-color-transparent-orange9: #fe6d15f7;
+  --t-color-transparent-orange10: #ff801f;
+  --t-color-transparent-orange11: #ffa057;
+  --t-color-transparent-orange12: #ffe0c2;
+  --t-color-transparent-yellow1: #d1510004;
+  --t-color-transparent-yellow2: #f9b4000b;
+  --t-color-transparent-yellow3: #ffaa001e;
+  --t-color-transparent-yellow4: #fdb70028;
+  --t-color-transparent-yellow5: #febb0036;
+  --t-color-transparent-yellow6: #fec40046;
+  --t-color-transparent-yellow7: #fdcb225c;
+  --t-color-transparent-yellow8: #fdca327b;
+  --t-color-transparent-yellow9: #ffe629;
+  --t-color-transparent-yellow10: #ffff57;
+  --t-color-transparent-yellow11: #fee949f5;
+  --t-color-transparent-yellow12: #fef6baf6;
+  --t-color-transparent-gray1: color(display-p3 1 1 1 / 0.031);
+  --t-color-transparent-gray2: color(display-p3 1 1 1 / 0.059);
+  --t-color-transparent-gray3: color(display-p3 1 1 1 / 0.047);
+  --t-color-transparent-gray4: color(display-p3 1 1 1 / 0.071);
+  --t-color-transparent-gray5: color(display-p3 1 1 1 / 0.102);
+  --t-color-transparent-gray6: color(display-p3 1 1 1 / 0.114);
+  --t-color-transparent-gray7: color(display-p3 1 1 1 / 0.141);
+  --t-color-transparent-gray8: color(display-p3 1 1 1 / 0.22);
+  --t-color-transparent-gray9: color(display-p3 1 1 1 / 0.427);
+  --t-color-transparent-gray10: color(display-p3 1 1 1 / 0.478);
+  --t-color-transparent-gray11: color(display-p3 1 1 1 / 0.565);
+  --t-color-transparent-gray12: color(display-p3 1 1 1 / 0.91);
+  --t-color-transparent-mauve1: #00000000;
+  --t-color-transparent-mauve2: #f5f4f609;
+  --t-color-transparent-mauve3: #ebeaf814;
+  --t-color-transparent-mauve4: #eee5f81d;
+  --t-color-transparent-mauve5: #efe6fe25;
+  --t-color-transparent-mauve6: #f1e6fd30;
+  --t-color-transparent-mauve7: #eee9ff40;
+  --t-color-transparent-mauve8: #eee7ff5d;
+  --t-color-transparent-mauve9: #eae6fd6e;
+  --t-color-transparent-mauve10: #ece9fd7c;
+  --t-color-transparent-mauve11: #f5f1ffb7;
+  --t-color-transparent-mauve12: #fdfdffef;
+  --t-color-transparent-slate1: #00000000;
+  --t-color-transparent-slate2: #d8f4f609;
+  --t-color-transparent-slate3: #ddeaf814;
+  --t-color-transparent-slate4: #d3edf81d;
+  --t-color-transparent-slate5: #d9edfe25;
+  --t-color-transparent-slate6: #d6ebfd30;
+  --t-color-transparent-slate7: #d9edff40;
+  --t-color-transparent-slate8: #d9edff5d;
+  --t-color-transparent-slate9: #dfebfd6d;
+  --t-color-transparent-slate10: #e5edfd7b;
+  --t-color-transparent-slate11: #f1f7feb5;
+  --t-color-transparent-slate12: #fcfdffef;
+  --t-color-transparent-sage1: #00000000;
+  --t-color-transparent-sage2: #f0f2f108;
+  --t-color-transparent-sage3: #f3f5f412;
+  --t-color-transparent-sage4: #f2fefd1a;
+  --t-color-transparent-sage5: #f1fbfa22;
+  --t-color-transparent-sage6: #edfbf42d;
+  --t-color-transparent-sage7: #edfcf73c;
+  --t-color-transparent-sage8: #ebfdf657;
+  --t-color-transparent-sage9: #dffdf266;
+  --t-color-transparent-sage10: #e5fdf674;
+  --t-color-transparent-sage11: #f4fefbb0;
+  --t-color-transparent-sage12: #fdfffeed;
+  --t-color-transparent-olive1: #00000000;
+  --t-color-transparent-olive2: #f1f2f008;
+  --t-color-transparent-olive3: #f4f5f312;
+  --t-color-transparent-olive4: #f3fef21a;
+  --t-color-transparent-olive5: #f2fbf122;
+  --t-color-transparent-olive6: #f4faed2c;
+  --t-color-transparent-olive7: #f2fced3b;
+  --t-color-transparent-olive8: #edfdeb57;
+  --t-color-transparent-olive9: #ebfde766;
+  --t-color-transparent-olive10: #f0fdec74;
+  --t-color-transparent-olive11: #f6fef4b0;
+  --t-color-transparent-olive12: #fdfffded;
+  --t-color-transparent-sand1: #00000000;
+  --t-color-transparent-sand2: #f4f4f309;
+  --t-color-transparent-sand3: #f6f6f513;
+  --t-color-transparent-sand4: #fefef31b;
+  --t-color-transparent-sand5: #fbfbeb23;
+  --t-color-transparent-sand6: #fffaed2d;
+  --t-color-transparent-sand7: #fffbed3c;
+  --t-color-transparent-sand8: #fff9eb57;
+  --t-color-transparent-sand9: #fffae965;
+  --t-color-transparent-sand10: #fffdee73;
+  --t-color-transparent-sand11: #fffcf4b0;
+  --t-color-transparent-sand12: #fffffded;
+  --t-color-transparent-tomato1: #f1121208;
+  --t-color-transparent-tomato2: #ff55330f;
+  --t-color-transparent-tomato3: #ff35232b;
+  --t-color-transparent-tomato4: #fd201142;
+  --t-color-transparent-tomato5: #fe332153;
+  --t-color-transparent-tomato6: #ff4f3864;
+  --t-color-transparent-tomato7: #fd644a7d;
+  --t-color-transparent-tomato8: #fe6d4ea7;
+  --t-color-transparent-tomato9: #fe5431e4;
+  --t-color-transparent-tomato10: #ff6847eb;
+  --t-color-transparent-tomato11: #ff977d;
+  --t-color-transparent-tomato12: #ffd6cefb;
+  --t-color-transparent-ruby1: #f4124a09;
+  --t-color-transparent-ruby2: #fe5a7f0e;
+  --t-color-transparent-ruby3: #ff235d2c;
+  --t-color-transparent-ruby4: #fd195e42;
+  --t-color-transparent-ruby5: #fe2d6b53;
+  --t-color-transparent-ruby6: #ff447665;
+  --t-color-transparent-ruby7: #ff577d80;
+  --t-color-transparent-ruby8: #ff5c7cae;
+  --t-color-transparent-ruby9: #fe4c70e4;
+  --t-color-transparent-ruby10: #ff617beb;
+  --t-color-transparent-ruby11: #ff949d;
+  --t-color-transparent-ruby12: #ffd3e2fe;
+  --t-color-transparent-crimson1: #f4126709;
+  --t-color-transparent-crimson2: #f22f7a11;
+  --t-color-transparent-crimson3: #fe2a8b2a;
+  --t-color-transparent-crimson4: #fd158741;
+  --t-color-transparent-crimson5: #fd278f51;
+  --t-color-transparent-crimson6: #fe459763;
+  --t-color-transparent-crimson7: #fd559b7f;
+  --t-color-transparent-crimson8: #fe5b9bab;
+  --t-color-transparent-crimson9: #fe418de8;
+  --t-color-transparent-crimson10: #ff5693ed;
+  --t-color-transparent-crimson11: #ff92ad;
+  --t-color-transparent-crimson12: #ffd5eafd;
+  --t-color-transparent-plum1: #f112f108;
+  --t-color-transparent-plum2: #f22ff211;
+  --t-color-transparent-plum3: #fd4cfd27;
+  --t-color-transparent-plum4: #f646ff3a;
+  --t-color-transparent-plum5: #f455ff48;
+  --t-color-transparent-plum6: #f66dff56;
+  --t-color-transparent-plum7: #f07cfd70;
+  --t-color-transparent-plum8: #ee84ff95;
+  --t-color-transparent-plum9: #e961feb6;
+  --t-color-transparent-plum10: #ed70ffc0;
+  --t-color-transparent-plum11: #f19cfef3;
+  --t-color-transparent-plum12: #feddfef4;
+  --t-color-transparent-violet1: #4422ff0f;
+  --t-color-transparent-violet2: #853ff916;
+  --t-color-transparent-violet3: #8354fe36;
+  --t-color-transparent-violet4: #7d51fd50;
+  --t-color-transparent-violet5: #845ffd5f;
+  --t-color-transparent-violet6: #8f6cfd6d;
+  --t-color-transparent-violet7: #9879ff83;
+  --t-color-transparent-violet8: #977dfea8;
+  --t-color-transparent-violet9: #8668ffcc;
+  --t-color-transparent-violet10: #9176fed7;
+  --t-color-transparent-violet11: #baa7ff;
+  --t-color-transparent-violet12: #e3defffe;
+  --t-color-transparent-iris1: #3636fe0e;
+  --t-color-transparent-iris2: #564bf916;
+  --t-color-transparent-iris3: #525bff3b;
+  --t-color-transparent-iris4: #4d58ff5a;
+  --t-color-transparent-iris5: #5b62fd6b;
+  --t-color-transparent-iris6: #6d6ffd7a;
+  --t-color-transparent-iris7: #7777fe8e;
+  --t-color-transparent-iris8: #7b7afeac;
+  --t-color-transparent-iris9: #6a6afed4;
+  --t-color-transparent-iris10: #7d79ffdc;
+  --t-color-transparent-iris11: #b1a9ff;
+  --t-color-transparent-iris12: #e1e0fffe;
+  --t-color-transparent-cyan1: #0091f70a;
+  --t-color-transparent-cyan2: #02a7f211;
+  --t-color-transparent-cyan3: #00befd28;
+  --t-color-transparent-cyan4: #00baff3b;
+  --t-color-transparent-cyan5: #00befd4d;
+  --t-color-transparent-cyan6: #00c7fd5e;
+  --t-color-transparent-cyan7: #14cdff75;
+  --t-color-transparent-cyan8: #11cfff95;
+  --t-color-transparent-cyan9: #00cfffc3;
+  --t-color-transparent-cyan10: #28d6ffcd;
+  --t-color-transparent-cyan11: #52e1fee5;
+  --t-color-transparent-cyan12: #bbf3fef7;
+  --t-color-transparent-jade1: #00de4505;
+  --t-color-transparent-jade2: #27fba60c;
+  --t-color-transparent-jade3: #02f99920;
+  --t-color-transparent-jade4: #00ffaa2d;
+  --t-color-transparent-jade5: #11ffb63b;
+  --t-color-transparent-jade6: #34ffc24b;
+  --t-color-transparent-jade7: #45fdc75e;
+  --t-color-transparent-jade8: #48ffcf75;
+  --t-color-transparent-jade9: #38feca9d;
+  --t-color-transparent-jade10: #31fec7ab;
+  --t-color-transparent-jade11: #21fec0d6;
+  --t-color-transparent-jade12: #b8ffe1ef;
+  --t-color-transparent-grass1: #00de1205;
+  --t-color-transparent-grass2: #5ef7780a;
+  --t-color-transparent-grass3: #70fe8c1b;
+  --t-color-transparent-grass4: #57ff802c;
+  --t-color-transparent-grass5: #68ff8b3b;
+  --t-color-transparent-grass6: #71ff8f4b;
+  --t-color-transparent-grass7: #77fd925d;
+  --t-color-transparent-grass8: #77fd9070;
+  --t-color-transparent-grass9: #65ff82a1;
+  --t-color-transparent-grass10: #72ff8dae;
+  --t-color-transparent-grass11: #89ff9fcd;
+  --t-color-transparent-grass12: #ceffceef;
+  --t-color-transparent-mint1: #00dede05;
+  --t-color-transparent-mint2: #00f9f90b;
+  --t-color-transparent-mint3: #00fff61d;
+  --t-color-transparent-mint4: #00fff42c;
+  --t-color-transparent-mint5: #00fff23a;
+  --t-color-transparent-mint6: #0effeb4a;
+  --t-color-transparent-mint7: #34fde55e;
+  --t-color-transparent-mint8: #41ffdf76;
+  --t-color-transparent-mint9: #92ffe7e9;
+  --t-color-transparent-mint10: #aefeedf5;
+  --t-color-transparent-mint11: #67ffded2;
+  --t-color-transparent-mint12: #cbfee9f5;
+  --t-color-transparent-lime1: #11bb0003;
+  --t-color-transparent-lime2: #78f7000a;
+  --t-color-transparent-lime3: #9bfd4c1a;
+  --t-color-transparent-lime4: #a7fe5c29;
+  --t-color-transparent-lime5: #affe6537;
+  --t-color-transparent-lime6: #b2fe6d46;
+  --t-color-transparent-lime7: #b6ff6f57;
+  --t-color-transparent-lime8: #b6fd6d6c;
+  --t-color-transparent-lime9: #caff69ed;
+  --t-color-transparent-lime10: #d4ff70;
+  --t-color-transparent-lime11: #d1fe77e4;
+  --t-color-transparent-lime12: #e9febff7;
+  --t-color-transparent-bronze1: #d1110004;
+  --t-color-transparent-bronze2: #fbbc910c;
+  --t-color-transparent-bronze3: #faceb817;
+  --t-color-transparent-bronze4: #facdb622;
+  --t-color-transparent-bronze5: #ffd2c12d;
+  --t-color-transparent-bronze6: #ffd1c03c;
+  --t-color-transparent-bronze7: #fdd0c04f;
+  --t-color-transparent-bronze8: #ffd6c565;
+  --t-color-transparent-bronze9: #fec7b09b;
+  --t-color-transparent-bronze10: #fecab5a9;
+  --t-color-transparent-bronze11: #ffd7c6d1;
+  --t-color-transparent-bronze12: #fff1e9ec;
+  --t-color-transparent-gold1: #91911102;
+  --t-color-transparent-gold2: #f9e29d0b;
+  --t-color-transparent-gold3: #f8ecbb15;
+  --t-color-transparent-gold4: #ffeec41e;
+  --t-color-transparent-gold5: #feecc22a;
+  --t-color-transparent-gold6: #feebcb37;
+  --t-color-transparent-gold7: #ffedcd48;
+  --t-color-transparent-gold8: #fdeaca5f;
+  --t-color-transparent-gold9: #ffdba690;
+  --t-color-transparent-gold10: #fedfb09d;
+  --t-color-transparent-gold11: #fee7c6c8;
+  --t-color-transparent-gold12: #fef7ede7;
+  --t-color-transparent-brown1: #91110002;
+  --t-color-transparent-brown2: #fba67c0c;
+  --t-color-transparent-brown3: #fcb58c19;
+  --t-color-transparent-brown4: #fbbb8a24;
+  --t-color-transparent-brown5: #fcb88931;
+  --t-color-transparent-brown6: #fdba8741;
+  --t-color-transparent-brown7: #ffbb8856;
+  --t-color-transparent-brown8: #ffbe8773;
+  --t-color-transparent-brown9: #feb87da8;
+  --t-color-transparent-brown10: #ffc18cb3;
+  --t-color-transparent-brown11: #fed1aad9;
+  --t-color-transparent-brown12: #feecd4f2;
+  --t-color-transparent-amber1: #e63c0006;
+  --t-color-transparent-amber2: #fd9b000d;
+  --t-color-transparent-amber3: #fa820022;
+  --t-color-transparent-amber4: #fc820032;
+  --t-color-transparent-amber5: #fd8b0041;
+  --t-color-transparent-amber6: #fd9b0051;
+  --t-color-transparent-amber7: #ffab2567;
+  --t-color-transparent-amber8: #ffae3587;
+  --t-color-transparent-amber9: #ffc53d;
+  --t-color-transparent-amber10: #ffd60a;
+  --t-color-transparent-amber11: #ffca16;
+  --t-color-transparent-amber12: #ffe7b3;
+}
diff --git a/packages/twenty-new-ui/src/theme-constants/theme-light.css b/packages/twenty-new-ui/src/theme-constants/theme-light.css
new file mode 100644
index 00000000000..a298848664b
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/theme-light.css
@@ -0,0 +1,1011 @@
+/* Theme CSS variables, mirrored token-for-token from twenty-ui.
+   Kept in sync by the theme parity test (src/theme-constants/__tests__). */
+
+.light {
+  --t-icon-size-sm: 14;
+  --t-icon-size-md: 16;
+  --t-icon-size-lg: 20;
+  --t-icon-size-xl: 24;
+  --t-icon-stroke-sm: 1.6;
+  --t-icon-stroke-md: 2;
+  --t-icon-stroke-lg: 2.5;
+  --t-modal-size-sm-width: 300px;
+  --t-modal-size-md-width: 400px;
+  --t-modal-size-lg-width: 53%;
+  --t-modal-size-xl-width: 1200px;
+  --t-modal-size-xl-height: 800px;
+  --t-modal-size-fullscreen-width: 100dvw;
+  --t-modal-size-fullscreen-height: 100dvh;
+  --t-text-line-height-lg: 1.5;
+  --t-text-line-height-md: 1.1;
+  --t-text-icon-size-medium: 16;
+  --t-text-icon-size-small: 14;
+  --t-text-icon-strike-light: 1.6;
+  --t-text-icon-strike-medium: 2;
+  --t-text-icon-strike-bold: 2.5;
+  --t-animation-duration-instant: 0.075;
+  --t-animation-duration-fast: 0.15;
+  --t-animation-duration-normal: 0.3;
+  --t-animation-duration-slow: 1.5;
+  --t-spacing-multiplicator: 4;
+  --t-spacing-0: 0px;
+  --t-spacing-1: 4px;
+  --t-spacing-2: 8px;
+  --t-spacing-3: 12px;
+  --t-spacing-4: 16px;
+  --t-spacing-5: 20px;
+  --t-spacing-6: 24px;
+  --t-spacing-7: 28px;
+  --t-spacing-8: 32px;
+  --t-spacing-9: 36px;
+  --t-spacing-10: 40px;
+  --t-spacing-11: 44px;
+  --t-spacing-12: 48px;
+  --t-spacing-13: 52px;
+  --t-spacing-14: 56px;
+  --t-spacing-15: 60px;
+  --t-spacing-16: 64px;
+  --t-spacing-17: 68px;
+  --t-spacing-18: 72px;
+  --t-spacing-19: 76px;
+  --t-spacing-20: 80px;
+  --t-spacing-21: 84px;
+  --t-spacing-22: 88px;
+  --t-spacing-23: 92px;
+  --t-spacing-24: 96px;
+  --t-spacing-25: 100px;
+  --t-spacing-26: 104px;
+  --t-spacing-27: 108px;
+  --t-spacing-28: 112px;
+  --t-spacing-29: 116px;
+  --t-spacing-30: 120px;
+  --t-spacing-31: 124px;
+  --t-spacing-32: 128px;
+  --t-spacing-0_5: 2px;
+  --t-spacing-1_5: 6px;
+  --t-between-siblings-gap: 2px;
+  --t-table-horizontal-cell-margin: 8px;
+  --t-table-checkbox-column-width: 32px;
+  --t-table-horizontal-cell-padding: 8px;
+  --t-side-panel-width: 500px;
+  --t-clickable-element-background-transition: background 0.1s ease;
+  --t-last-layer-z-index: 2147483647;
+  --t-buttons-secondary-text-color: color(display-p3 0.63 0.69 1);
+  --t-accent-primary: color(display-p3 0.831 0.87 1);
+  --t-accent-secondary: color(display-p3 0.831 0.87 1);
+  --t-accent-tertiary: color(display-p3 0.933 0.948 0.992);
+  --t-accent-quaternary: color(display-p3 0.971 0.977 0.998);
+  --t-accent-accent3570: color(display-p3 0.569 0.639 0.916);
+  --t-accent-accent4060: color(display-p3 0.569 0.639 0.916);
+  --t-accent-accent1: color(display-p3 0.992 0.992 0.996);
+  --t-accent-accent2: color(display-p3 0.971 0.977 0.998);
+  --t-accent-accent3: color(display-p3 0.933 0.948 0.992);
+  --t-accent-accent4: color(display-p3 0.885 0.914 1);
+  --t-accent-accent5: color(display-p3 0.831 0.87 1);
+  --t-accent-accent6: color(display-p3 0.767 0.814 0.995);
+  --t-accent-accent7: color(display-p3 0.685 0.74 0.957);
+  --t-accent-accent8: color(display-p3 0.569 0.639 0.916);
+  --t-accent-accent9: color(display-p3 0.276 0.384 0.837);
+  --t-accent-accent10: color(display-p3 0.234 0.343 0.801);
+  --t-accent-accent11: color(display-p3 0.256 0.354 0.755);
+  --t-accent-accent12: color(display-p3 0.133 0.175 0.348);
+  --t-background-noisy: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIYAAABQCAIAAABTfJr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAF0WlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNy4xLWMwMDAgNzkuOWNjYzRkZTkzLCAyMDIyLzAzLzE0LTE0OjA3OjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjMuMyAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjMtMDctMThUMTI6MjY6MzQrMDI6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIzLTA3LTE4VDEyOjI4OjMyKzAyOjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIzLTA3LTE4VDEyOjI4OjMyKzAyOjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDphZWU5ZDg2OC04OWRmLTRiMDAtYWQ5ZS0zZDQyMTJjZjNhM2UiIHhtcE1NOkRvY3VtZW50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);
+  --t-background-primary: color(display-p3 1 1 1);
+  --t-background-secondary: color(display-p3 0.988 0.988 0.988);
+  --t-background-tertiary: color(display-p3 0.945 0.945 0.945);
+  --t-background-quaternary: color(display-p3 0.922 0.922 0.922);
+  --t-background-inverted-primary: color(display-p3 0.2 0.2 0.2);
+  --t-background-inverted-secondary: color(display-p3 0.4 0.4 0.4);
+  --t-background-danger: color(display-p3 0.985 0.925 0.925);
+  --t-background-transparent-primary: color(display-p3 1 1 1 / 0.5);
+  --t-background-transparent-secondary: color(display-p3 1 1 1 / 0.4);
+  --t-background-transparent-strong: color(display-p3 0 0 0 / 0.161);
+  --t-background-transparent-medium: color(display-p3 0 0 0 / 0.078);
+  --t-background-transparent-light: color(display-p3 0 0 0 / 0.039);
+  --t-background-transparent-lighter: color(display-p3 0 0 0 / 0.02);
+  --t-background-transparent-danger: #f3000d14;
+  --t-background-transparent-blue: #0047f112;
+  --t-background-transparent-orange: #ff9c0029;
+  --t-background-transparent-success: #00a43319;
+  --t-background-overlay-primary: color(display-p3 0 0 0 / 0.722);
+  --t-background-overlay-secondary: color(display-p3 0 0 0 / 0.361);
+  --t-background-overlay-tertiary: color(display-p3 0 0 0 / 0.071);
+  --t-background-radial-gradient: radial-gradient(
+    50% 62.62% at 50% 0%,
+    color(display-p3 0.6 0.6 0.6) 0%,
+    color(display-p3 0.514 0.514 0.514) 100%
+  );
+  --t-background-radial-gradient-hover: radial-gradient(
+    76.32% 95.59% at 50% 0%,
+    color(display-p3 0.514 0.514 0.514) 0%,
+    color(display-p3 0.4 0.4 0.4) 100%
+  );
+  --t-background-primary-inverted: color(display-p3 0.2 0.2 0.2);
+  --t-background-primary-inverted-hover: color(display-p3 0.4 0.4 0.4);
+  --t-blur-light: blur(6px) saturate(200%) contrast(50%) brightness(130%);
+  --t-blur-medium: blur(12px) saturate(200%) contrast(50%) brightness(130%);
+  --t-blur-strong: blur(20px) saturate(200%) contrast(50%) brightness(130%);
+  --t-border-color-strong: color(display-p3 0.839 0.839 0.839);
+  --t-border-color-medium: color(display-p3 0.922 0.922 0.922);
+  --t-border-color-light: color(display-p3 0.945 0.945 0.945);
+  --t-border-color-secondary-inverted: color(display-p3 0.4 0.4 0.4);
+  --t-border-color-inverted: color(display-p3 0.2 0.2 0.2);
+  --t-border-color-danger: color(display-p3 0.984 0.812 0.811);
+  --t-border-color-blue: color(display-p3 0.685 0.74 0.957);
+  --t-border-color-transparent-strong: color(display-p3 0 0 0 / 0.071);
+  --t-border-radius-xs: 2px;
+  --t-border-radius-sm: 4px;
+  --t-border-radius-md: 8px;
+  --t-border-radius-xl: 20px;
+  --t-border-radius-xxl: 40px;
+  --t-border-radius-pill: 999px;
+  --t-border-radius-rounded: 100%;
+  --t-box-shadow-color: color(display-p3 0 0 0 / 0.039);
+  --t-box-shadow-light:
+    0px 2px 4px 0px color(display-p3 0 0 0 / 0.039),
+    0px 0px 4px 0px color(display-p3 0 0 0 / 0.078);
+  --t-box-shadow-strong:
+    2px 4px 16px 0px color(display-p3 0 0 0 / 0.161),
+    0px 2px 4px 0px color(display-p3 0 0 0 / 0.078);
+  --t-box-shadow-underline: 0px 1px 0px 0px color(display-p3 0 0 0 / 0.361);
+  --t-box-shadow-super-heavy:
+    0px 0px 8px 0px color(display-p3 0 0 0 / 0.161),
+    0px 8px 64px -16px color(display-p3 0 0 0 / 0.478),
+    0px 24px 56px -16px color(display-p3 0 0 0 / 0.078);
+  --t-font-color-primary: color(display-p3 0.2 0.2 0.2);
+  --t-font-color-secondary: color(display-p3 0.4 0.4 0.4);
+  --t-font-color-tertiary: color(display-p3 0.6 0.6 0.6);
+  --t-font-color-light: color(display-p3 0.702 0.702 0.702);
+  --t-font-color-extra-light: color(display-p3 0.8 0.8 0.8);
+  --t-font-color-inverted: color(display-p3 1 1 1);
+  --t-font-color-danger: color(display-p3 0.83 0.329 0.324);
+  --t-font-size-xxs: 0.625rem;
+  --t-font-size-xs: 0.85rem;
+  --t-font-size-sm: 0.92rem;
+  --t-font-size-md: 1rem;
+  --t-font-size-lg: 1.23rem;
+  --t-font-size-xl: 1.54rem;
+  --t-font-size-xxl: 1.85rem;
+  --t-font-weight-regular: 400;
+  --t-font-weight-medium: 500;
+  --t-font-weight-semi-bold: 600;
+  --t-font-family: Inter, sans-serif;
+  --t-name: light;
+  --t-snack-bar-success-color: color(display-p3 0.297 0.637 0.581);
+  --t-snack-bar-success-background-color: #00a43319;
+  --t-snack-bar-error-color: color(display-p3 0.83 0.329 0.324);
+  --t-snack-bar-error-background-color: #f3000d14;
+  --t-snack-bar-warning-color: color(display-p3 0.9 0.45 0.2);
+  --t-snack-bar-warning-background-color: #ff9c0029;
+  --t-snack-bar-info-color: color(display-p3 0.276 0.384 0.837);
+  --t-snack-bar-info-background-color: #0047f112;
+  --t-snack-bar-default-color: color(display-p3 0.2 0.2 0.2);
+  --t-snack-bar-default-background-color: color(display-p3 0 0 0 / 0.039);
+  --t-tag-text-gray: color(display-p3 0.4 0.4 0.4);
+  --t-tag-text-mauve: color(display-p3 0.395 0.388 0.424);
+  --t-tag-text-slate: color(display-p3 0.379 0.392 0.421);
+  --t-tag-text-sage: color(display-p3 0.377 0.395 0.389);
+  --t-tag-text-olive: color(display-p3 0.38 0.395 0.374);
+  --t-tag-text-sand: color(display-p3 0.388 0.388 0.37);
+  --t-tag-text-tomato: color(display-p3 0.755 0.259 0.152);
+  --t-tag-text-red: color(display-p3 0.744 0.234 0.222);
+  --t-tag-text-ruby: color(display-p3 0.728 0.211 0.311);
+  --t-tag-text-crimson: color(display-p3 0.731 0.195 0.388);
+  --t-tag-text-pink: color(display-p3 0.698 0.219 0.528);
+  --t-tag-text-plum: color(display-p3 0.543 0.263 0.619);
+  --t-tag-text-purple: color(display-p3 0.473 0.281 0.687);
+  --t-tag-text-violet: color(display-p3 0.383 0.317 0.702);
+  --t-tag-text-iris: color(display-p3 0.337 0.326 0.748);
+  --t-tag-text-cyan: color(display-p3 0.08 0.48 0.63);
+  --t-tag-text-turquoise: color(display-p3 0.08 0.5 0.43);
+  --t-tag-text-sky: color(display-p3 0.193 0.448 0.605);
+  --t-tag-text-blue: color(display-p3 0.256 0.354 0.755);
+  --t-tag-text-jade: color(display-p3 0.15 0.5 0.37);
+  --t-tag-text-green: color(display-p3 0.19 0.5 0.32);
+  --t-tag-text-grass: color(display-p3 0.263 0.488 0.261);
+  --t-tag-text-mint: color(display-p3 0.203 0.463 0.397);
+  --t-tag-text-lime: color(display-p3 0.386 0.482 0.227);
+  --t-tag-text-bronze: color(display-p3 0.471 0.373 0.336);
+  --t-tag-text-gold: color(display-p3 0.433 0.386 0.305);
+  --t-tag-text-brown: color(display-p3 0.485 0.374 0.288);
+  --t-tag-text-orange: color(display-p3 0.76 0.34 0);
+  --t-tag-text-amber: color(display-p3 0.64 0.4 0);
+  --t-tag-text-yellow: color(display-p3 0.6 0.44 0);
+  --t-tag-background-gray: color(display-p3 0.976 0.976 0.976);
+  --t-tag-background-mauve: color(display-p3 0.946 0.938 0.952);
+  --t-tag-background-slate: color(display-p3 0.94 0.941 0.953);
+  --t-tag-background-sage: color(display-p3 0.935 0.944 0.94);
+  --t-tag-background-olive: color(display-p3 0.939 0.945 0.937);
+  --t-tag-background-sand: color(display-p3 0.943 0.942 0.936);
+  --t-tag-background-tomato: color(display-p3 0.985 0.924 0.909);
+  --t-tag-background-red: color(display-p3 0.985 0.925 0.925);
+  --t-tag-background-ruby: color(display-p3 0.983 0.92 0.928);
+  --t-tag-background-crimson: color(display-p3 0.987 0.917 0.941);
+  --t-tag-background-pink: color(display-p3 0.981 0.917 0.96);
+  --t-tag-background-plum: color(display-p3 0.973 0.923 0.98);
+  --t-tag-background-purple: color(display-p3 0.963 0.931 0.989);
+  --t-tag-background-violet: color(display-p3 0.953 0.943 0.993);
+  --t-tag-background-iris: color(display-p3 0.943 0.945 0.992);
+  --t-tag-background-cyan: color(display-p3 0.888 0.965 0.975);
+  --t-tag-background-turquoise: color(display-p3 0.895 0.971 0.952);
+  --t-tag-background-sky: color(display-p3 0.899 0.963 0.989);
+  --t-tag-background-blue: color(display-p3 0.933 0.948 0.992);
+  --t-tag-background-jade: color(display-p3 0.912 0.965 0.932);
+  --t-tag-background-green: color(display-p3 0.913 0.964 0.925);
+  --t-tag-background-grass: color(display-p3 0.923 0.965 0.917);
+  --t-tag-background-mint: color(display-p3 0.888 0.972 0.95);
+  --t-tag-background-lime: color(display-p3 0.939 0.965 0.851);
+  --t-tag-background-bronze: color(display-p3 0.958 0.932 0.919);
+  --t-tag-background-gold: color(display-p3 0.947 0.94 0.909);
+  --t-tag-background-brown: color(display-p3 0.959 0.936 0.909);
+  --t-tag-background-orange: color(display-p3 0.989 0.938 0.85);
+  --t-tag-background-amber: color(display-p3 0.994 0.969 0.782);
+  --t-tag-background-yellow: color(display-p3 0.997 0.982 0.749);
+  --t-code-text-gray: color(display-p3 0.514 0.514 0.514);
+  --t-code-text-sky: color(display-p3 0.555 0.845 0.959);
+  --t-code-text-pink: color(display-p3 0.748 0.27 0.581);
+  --t-code-text-orange: color(display-p3 0.877 0.597 0.379);
+  --t-code-text-green: color(display-p3 0.585 0.707 0.378);
+  --t-code-font-family: DM Mono;
+  --t--illustration-icon-color-blue: color(display-p3 0.569 0.639 0.916);
+  --t--illustration-icon-color-gray: color(display-p3 0.6 0.6 0.6);
+  --t--illustration-icon-fill-blue: color(display-p3 0.831 0.87 1);
+  --t--illustration-icon-fill-gray: color(display-p3 0.922 0.922 0.922);
+  --t-gray-scale-gray1: color(display-p3 1 1 1);
+  --t-gray-scale-gray2: color(display-p3 0.988 0.988 0.988);
+  --t-gray-scale-gray3: color(display-p3 0.976 0.976 0.976);
+  --t-gray-scale-gray4: color(display-p3 0.945 0.945 0.945);
+  --t-gray-scale-gray5: color(display-p3 0.922 0.922 0.922);
+  --t-gray-scale-gray6: color(display-p3 0.839 0.839 0.839);
+  --t-gray-scale-gray7: color(display-p3 0.8 0.8 0.8);
+  --t-gray-scale-gray8: color(display-p3 0.702 0.702 0.702);
+  --t-gray-scale-gray9: color(display-p3 0.6 0.6 0.6);
+  --t-gray-scale-gray10: color(display-p3 0.514 0.514 0.514);
+  --t-gray-scale-gray11: color(display-p3 0.4 0.4 0.4);
+  --t-gray-scale-gray12: color(display-p3 0.2 0.2 0.2);
+  --t-color-red: color(display-p3 0.83 0.329 0.324);
+  --t-color-ruby: color(display-p3 0.83 0.323 0.408);
+  --t-color-crimson: color(display-p3 0.843 0.298 0.507);
+  --t-color-tomato: color(display-p3 0.831 0.345 0.231);
+  --t-color-orange: color(display-p3 0.9 0.45 0.2);
+  --t-color-amber: color(display-p3 1 0.77 0.26);
+  --t-color-yellow: color(display-p3 1 0.92 0.22);
+  --t-color-lime: color(display-p3 0.78 0.928 0.466);
+  --t-color-grass: color(display-p3 0.38 0.647 0.378);
+  --t-color-green: color(display-p3 0.332 0.634 0.442);
+  --t-color-jade: color(display-p3 0.319 0.63 0.521);
+  --t-color-mint: color(display-p3 0.62 0.908 0.834);
+  --t-color-turquoise: color(display-p3 0.297 0.637 0.581);
+  --t-color-cyan: color(display-p3 0.282 0.627 0.765);
+  --t-color-sky: color(display-p3 0.585 0.877 0.983);
+  --t-color-blue: color(display-p3 0.276 0.384 0.837);
+  --t-color-iris: color(display-p3 0.357 0.357 0.81);
+  --t-color-violet: color(display-p3 0.417 0.341 0.784);
+  --t-color-purple: color(display-p3 0.523 0.318 0.751);
+  --t-color-plum: color(display-p3 0.624 0.313 0.708);
+  --t-color-pink: color(display-p3 0.775 0.297 0.61);
+  --t-color-bronze: color(display-p3 0.611 0.507 0.455);
+  --t-color-gold: color(display-p3 0.579 0.517 0.41);
+  --t-color-brown: color(display-p3 0.651 0.505 0.368);
+  --t-color-gray: color(display-p3 0.6 0.6 0.6);
+  --t-color-yellow1: color(display-p3 0.992 0.992 0.978);
+  --t-color-yellow2: color(display-p3 0.995 0.99 0.922);
+  --t-color-yellow3: color(display-p3 0.997 0.982 0.749);
+  --t-color-yellow4: color(display-p3 0.992 0.953 0.627);
+  --t-color-yellow5: color(display-p3 0.984 0.91 0.51);
+  --t-color-yellow6: color(display-p3 0.934 0.847 0.474);
+  --t-color-yellow7: color(display-p3 0.876 0.785 0.46);
+  --t-color-yellow8: color(display-p3 0.811 0.689 0.313);
+  --t-color-yellow9: color(display-p3 1 0.92 0.22);
+  --t-color-yellow10: color(display-p3 0.977 0.868 0.291);
+  --t-color-yellow11: color(display-p3 0.6 0.44 0);
+  --t-color-yellow12: color(display-p3 0.271 0.233 0.137);
+  --t-color-green1: color(display-p3 0.986 0.996 0.989);
+  --t-color-green2: color(display-p3 0.963 0.983 0.967);
+  --t-color-green3: color(display-p3 0.913 0.964 0.925);
+  --t-color-green4: color(display-p3 0.859 0.94 0.879);
+  --t-color-green5: color(display-p3 0.796 0.907 0.826);
+  --t-color-green6: color(display-p3 0.718 0.863 0.761);
+  --t-color-green7: color(display-p3 0.61 0.801 0.675);
+  --t-color-green8: color(display-p3 0.451 0.715 0.559);
+  --t-color-green9: color(display-p3 0.332 0.634 0.442);
+  --t-color-green10: color(display-p3 0.308 0.595 0.417);
+  --t-color-green11: color(display-p3 0.19 0.5 0.32);
+  --t-color-green12: color(display-p3 0.132 0.228 0.18);
+  --t-color-turquoise1: color(display-p3 0.983 0.996 0.992);
+  --t-color-turquoise2: color(display-p3 0.958 0.983 0.976);
+  --t-color-turquoise3: color(display-p3 0.895 0.971 0.952);
+  --t-color-turquoise4: color(display-p3 0.831 0.949 0.92);
+  --t-color-turquoise5: color(display-p3 0.761 0.914 0.878);
+  --t-color-turquoise6: color(display-p3 0.682 0.864 0.825);
+  --t-color-turquoise7: color(display-p3 0.581 0.798 0.756);
+  --t-color-turquoise8: color(display-p3 0.433 0.716 0.671);
+  --t-color-turquoise9: color(display-p3 0.297 0.637 0.581);
+  --t-color-turquoise10: color(display-p3 0.275 0.599 0.542);
+  --t-color-turquoise11: color(display-p3 0.08 0.5 0.43);
+  --t-color-turquoise12: color(display-p3 0.11 0.235 0.219);
+  --t-color-sky1: color(display-p3 0.98 0.995 0.999);
+  --t-color-sky2: color(display-p3 0.953 0.98 0.99);
+  --t-color-sky3: color(display-p3 0.899 0.963 0.989);
+  --t-color-sky4: color(display-p3 0.842 0.937 0.977);
+  --t-color-sky5: color(display-p3 0.777 0.9 0.954);
+  --t-color-sky6: color(display-p3 0.701 0.851 0.921);
+  --t-color-sky7: color(display-p3 0.604 0.785 0.879);
+  --t-color-sky8: color(display-p3 0.457 0.696 0.829);
+  --t-color-sky9: color(display-p3 0.585 0.877 0.983);
+  --t-color-sky10: color(display-p3 0.555 0.845 0.959);
+  --t-color-sky11: color(display-p3 0.193 0.448 0.605);
+  --t-color-sky12: color(display-p3 0.145 0.241 0.329);
+  --t-color-blue1: color(display-p3 0.992 0.992 0.996);
+  --t-color-blue2: color(display-p3 0.971 0.977 0.998);
+  --t-color-blue3: color(display-p3 0.933 0.948 0.992);
+  --t-color-blue4: color(display-p3 0.885 0.914 1);
+  --t-color-blue5: color(display-p3 0.831 0.87 1);
+  --t-color-blue6: color(display-p3 0.767 0.814 0.995);
+  --t-color-blue7: color(display-p3 0.685 0.74 0.957);
+  --t-color-blue8: color(display-p3 0.569 0.639 0.916);
+  --t-color-blue9: color(display-p3 0.276 0.384 0.837);
+  --t-color-blue10: color(display-p3 0.234 0.343 0.801);
+  --t-color-blue11: color(display-p3 0.256 0.354 0.755);
+  --t-color-blue12: color(display-p3 0.133 0.175 0.348);
+  --t-color-purple1: color(display-p3 0.995 0.988 0.996);
+  --t-color-purple2: color(display-p3 0.983 0.971 0.993);
+  --t-color-purple3: color(display-p3 0.963 0.931 0.989);
+  --t-color-purple4: color(display-p3 0.937 0.888 0.981);
+  --t-color-purple5: color(display-p3 0.904 0.837 0.966);
+  --t-color-purple6: color(display-p3 0.86 0.774 0.942);
+  --t-color-purple7: color(display-p3 0.799 0.69 0.91);
+  --t-color-purple8: color(display-p3 0.719 0.583 0.874);
+  --t-color-purple9: color(display-p3 0.523 0.318 0.751);
+  --t-color-purple10: color(display-p3 0.483 0.289 0.7);
+  --t-color-purple11: color(display-p3 0.473 0.281 0.687);
+  --t-color-purple12: color(display-p3 0.234 0.132 0.363);
+  --t-color-pink1: color(display-p3 0.998 0.989 0.996);
+  --t-color-pink2: color(display-p3 0.992 0.97 0.985);
+  --t-color-pink3: color(display-p3 0.981 0.917 0.96);
+  --t-color-pink4: color(display-p3 0.963 0.867 0.932);
+  --t-color-pink5: color(display-p3 0.939 0.815 0.899);
+  --t-color-pink6: color(display-p3 0.907 0.756 0.859);
+  --t-color-pink7: color(display-p3 0.869 0.683 0.81);
+  --t-color-pink8: color(display-p3 0.825 0.59 0.751);
+  --t-color-pink9: color(display-p3 0.775 0.297 0.61);
+  --t-color-pink10: color(display-p3 0.748 0.27 0.581);
+  --t-color-pink11: color(display-p3 0.698 0.219 0.528);
+  --t-color-pink12: color(display-p3 0.363 0.101 0.279);
+  --t-color-red1: color(display-p3 0.998 0.989 0.988);
+  --t-color-red2: color(display-p3 0.995 0.971 0.971);
+  --t-color-red3: color(display-p3 0.985 0.925 0.925);
+  --t-color-red4: color(display-p3 0.999 0.866 0.866);
+  --t-color-red5: color(display-p3 0.984 0.812 0.811);
+  --t-color-red6: color(display-p3 0.955 0.751 0.749);
+  --t-color-red7: color(display-p3 0.915 0.675 0.672);
+  --t-color-red8: color(display-p3 0.872 0.575 0.572);
+  --t-color-red9: color(display-p3 0.83 0.329 0.324);
+  --t-color-red10: color(display-p3 0.798 0.294 0.285);
+  --t-color-red11: color(display-p3 0.744 0.234 0.222);
+  --t-color-red12: color(display-p3 0.36 0.115 0.143);
+  --t-color-orange1: color(display-p3 0.995 0.988 0.985);
+  --t-color-orange2: color(display-p3 0.994 0.968 0.934);
+  --t-color-orange3: color(display-p3 0.989 0.938 0.85);
+  --t-color-orange4: color(display-p3 1 0.874 0.687);
+  --t-color-orange5: color(display-p3 1 0.821 0.583);
+  --t-color-orange6: color(display-p3 0.975 0.767 0.545);
+  --t-color-orange7: color(display-p3 0.919 0.693 0.486);
+  --t-color-orange8: color(display-p3 0.877 0.597 0.379);
+  --t-color-orange9: color(display-p3 0.9 0.45 0.2);
+  --t-color-orange10: color(display-p3 0.87 0.409 0.164);
+  --t-color-orange11: color(display-p3 0.76 0.34 0);
+  --t-color-orange12: color(display-p3 0.323 0.185 0.127);
+  --t-color-gray1: color(display-p3 1 1 1);
+  --t-color-gray2: color(display-p3 0.988 0.988 0.988);
+  --t-color-gray3: color(display-p3 0.976 0.976 0.976);
+  --t-color-gray4: color(display-p3 0.945 0.945 0.945);
+  --t-color-gray5: color(display-p3 0.922 0.922 0.922);
+  --t-color-gray6: color(display-p3 0.839 0.839 0.839);
+  --t-color-gray7: color(display-p3 0.8 0.8 0.8);
+  --t-color-gray8: color(display-p3 0.702 0.702 0.702);
+  --t-color-gray9: color(display-p3 0.6 0.6 0.6);
+  --t-color-gray10: color(display-p3 0.514 0.514 0.514);
+  --t-color-gray11: color(display-p3 0.4 0.4 0.4);
+  --t-color-gray12: color(display-p3 0.2 0.2 0.2);
+  --t-color-mauve1: color(display-p3 0.991 0.988 0.992);
+  --t-color-mauve2: color(display-p3 0.98 0.976 0.984);
+  --t-color-mauve3: color(display-p3 0.946 0.938 0.952);
+  --t-color-mauve4: color(display-p3 0.915 0.906 0.925);
+  --t-color-mauve5: color(display-p3 0.886 0.876 0.901);
+  --t-color-mauve6: color(display-p3 0.856 0.846 0.875);
+  --t-color-mauve7: color(display-p3 0.814 0.804 0.84);
+  --t-color-mauve8: color(display-p3 0.735 0.728 0.777);
+  --t-color-mauve9: color(display-p3 0.555 0.549 0.596);
+  --t-color-mauve10: color(display-p3 0.514 0.508 0.552);
+  --t-color-mauve11: color(display-p3 0.395 0.388 0.424);
+  --t-color-mauve12: color(display-p3 0.128 0.122 0.147);
+  --t-color-slate1: color(display-p3 0.988 0.988 0.992);
+  --t-color-slate2: color(display-p3 0.976 0.976 0.984);
+  --t-color-slate3: color(display-p3 0.94 0.941 0.953);
+  --t-color-slate4: color(display-p3 0.908 0.909 0.925);
+  --t-color-slate5: color(display-p3 0.88 0.881 0.901);
+  --t-color-slate6: color(display-p3 0.85 0.852 0.876);
+  --t-color-slate7: color(display-p3 0.805 0.808 0.838);
+  --t-color-slate8: color(display-p3 0.727 0.733 0.773);
+  --t-color-slate9: color(display-p3 0.547 0.553 0.592);
+  --t-color-slate10: color(display-p3 0.503 0.512 0.549);
+  --t-color-slate11: color(display-p3 0.379 0.392 0.421);
+  --t-color-slate12: color(display-p3 0.113 0.125 0.14);
+  --t-color-sage1: color(display-p3 0.986 0.992 0.988);
+  --t-color-sage2: color(display-p3 0.97 0.977 0.974);
+  --t-color-sage3: color(display-p3 0.935 0.944 0.94);
+  --t-color-sage4: color(display-p3 0.904 0.913 0.909);
+  --t-color-sage5: color(display-p3 0.875 0.885 0.88);
+  --t-color-sage6: color(display-p3 0.844 0.854 0.849);
+  --t-color-sage7: color(display-p3 0.8 0.811 0.806);
+  --t-color-sage8: color(display-p3 0.725 0.738 0.732);
+  --t-color-sage9: color(display-p3 0.531 0.556 0.546);
+  --t-color-sage10: color(display-p3 0.492 0.515 0.506);
+  --t-color-sage11: color(display-p3 0.377 0.395 0.389);
+  --t-color-sage12: color(display-p3 0.107 0.129 0.118);
+  --t-color-olive1: color(display-p3 0.989 0.992 0.989);
+  --t-color-olive2: color(display-p3 0.974 0.98 0.973);
+  --t-color-olive3: color(display-p3 0.939 0.945 0.937);
+  --t-color-olive4: color(display-p3 0.907 0.914 0.905);
+  --t-color-olive5: color(display-p3 0.878 0.885 0.875);
+  --t-color-olive6: color(display-p3 0.846 0.855 0.843);
+  --t-color-olive7: color(display-p3 0.803 0.812 0.8);
+  --t-color-olive8: color(display-p3 0.727 0.738 0.723);
+  --t-color-olive9: color(display-p3 0.541 0.556 0.532);
+  --t-color-olive10: color(display-p3 0.5 0.515 0.491);
+  --t-color-olive11: color(display-p3 0.38 0.395 0.374);
+  --t-color-olive12: color(display-p3 0.117 0.129 0.111);
+  --t-color-sand1: color(display-p3 0.992 0.992 0.989);
+  --t-color-sand2: color(display-p3 0.977 0.977 0.973);
+  --t-color-sand3: color(display-p3 0.943 0.942 0.936);
+  --t-color-sand4: color(display-p3 0.913 0.912 0.903);
+  --t-color-sand5: color(display-p3 0.885 0.883 0.873);
+  --t-color-sand6: color(display-p3 0.854 0.852 0.839);
+  --t-color-sand7: color(display-p3 0.813 0.81 0.794);
+  --t-color-sand8: color(display-p3 0.738 0.734 0.713);
+  --t-color-sand9: color(display-p3 0.553 0.553 0.528);
+  --t-color-sand10: color(display-p3 0.511 0.511 0.488);
+  --t-color-sand11: color(display-p3 0.388 0.388 0.37);
+  --t-color-sand12: color(display-p3 0.129 0.126 0.111);
+  --t-color-tomato1: color(display-p3 0.998 0.989 0.988);
+  --t-color-tomato2: color(display-p3 0.994 0.974 0.969);
+  --t-color-tomato3: color(display-p3 0.985 0.924 0.909);
+  --t-color-tomato4: color(display-p3 0.996 0.868 0.835);
+  --t-color-tomato5: color(display-p3 0.98 0.812 0.77);
+  --t-color-tomato6: color(display-p3 0.953 0.75 0.698);
+  --t-color-tomato7: color(display-p3 0.917 0.673 0.611);
+  --t-color-tomato8: color(display-p3 0.875 0.575 0.502);
+  --t-color-tomato9: color(display-p3 0.831 0.345 0.231);
+  --t-color-tomato10: color(display-p3 0.802 0.313 0.2);
+  --t-color-tomato11: color(display-p3 0.755 0.259 0.152);
+  --t-color-tomato12: color(display-p3 0.335 0.165 0.132);
+  --t-color-ruby1: color(display-p3 0.998 0.989 0.992);
+  --t-color-ruby2: color(display-p3 0.995 0.971 0.974);
+  --t-color-ruby3: color(display-p3 0.983 0.92 0.928);
+  --t-color-ruby4: color(display-p3 0.987 0.869 0.885);
+  --t-color-ruby5: color(display-p3 0.968 0.817 0.839);
+  --t-color-ruby6: color(display-p3 0.937 0.758 0.786);
+  --t-color-ruby7: color(display-p3 0.897 0.685 0.721);
+  --t-color-ruby8: color(display-p3 0.851 0.588 0.639);
+  --t-color-ruby9: color(display-p3 0.83 0.323 0.408);
+  --t-color-ruby10: color(display-p3 0.795 0.286 0.375);
+  --t-color-ruby11: color(display-p3 0.728 0.211 0.311);
+  --t-color-ruby12: color(display-p3 0.36 0.115 0.171);
+  --t-color-crimson1: color(display-p3 0.998 0.989 0.992);
+  --t-color-crimson2: color(display-p3 0.991 0.969 0.976);
+  --t-color-crimson3: color(display-p3 0.987 0.917 0.941);
+  --t-color-crimson4: color(display-p3 0.975 0.866 0.904);
+  --t-color-crimson5: color(display-p3 0.953 0.813 0.864);
+  --t-color-crimson6: color(display-p3 0.921 0.755 0.817);
+  --t-color-crimson7: color(display-p3 0.88 0.683 0.761);
+  --t-color-crimson8: color(display-p3 0.834 0.592 0.694);
+  --t-color-crimson9: color(display-p3 0.843 0.298 0.507);
+  --t-color-crimson10: color(display-p3 0.807 0.266 0.468);
+  --t-color-crimson11: color(display-p3 0.731 0.195 0.388);
+  --t-color-crimson12: color(display-p3 0.352 0.111 0.221);
+  --t-color-plum1: color(display-p3 0.995 0.988 0.999);
+  --t-color-plum2: color(display-p3 0.988 0.971 0.99);
+  --t-color-plum3: color(display-p3 0.973 0.923 0.98);
+  --t-color-plum4: color(display-p3 0.953 0.875 0.966);
+  --t-color-plum5: color(display-p3 0.926 0.825 0.945);
+  --t-color-plum6: color(display-p3 0.89 0.765 0.916);
+  --t-color-plum7: color(display-p3 0.84 0.686 0.877);
+  --t-color-plum8: color(display-p3 0.775 0.58 0.832);
+  --t-color-plum9: color(display-p3 0.624 0.313 0.708);
+  --t-color-plum10: color(display-p3 0.587 0.29 0.667);
+  --t-color-plum11: color(display-p3 0.543 0.263 0.619);
+  --t-color-plum12: color(display-p3 0.299 0.114 0.352);
+  --t-color-violet1: color(display-p3 0.991 0.988 0.995);
+  --t-color-violet2: color(display-p3 0.978 0.974 0.998);
+  --t-color-violet3: color(display-p3 0.953 0.943 0.993);
+  --t-color-violet4: color(display-p3 0.916 0.897 1);
+  --t-color-violet5: color(display-p3 0.876 0.851 1);
+  --t-color-violet6: color(display-p3 0.825 0.793 0.981);
+  --t-color-violet7: color(display-p3 0.752 0.712 0.943);
+  --t-color-violet8: color(display-p3 0.654 0.602 0.902);
+  --t-color-violet9: color(display-p3 0.417 0.341 0.784);
+  --t-color-violet10: color(display-p3 0.381 0.306 0.741);
+  --t-color-violet11: color(display-p3 0.383 0.317 0.702);
+  --t-color-violet12: color(display-p3 0.179 0.15 0.359);
+  --t-color-iris1: color(display-p3 0.992 0.992 0.999);
+  --t-color-iris2: color(display-p3 0.972 0.973 0.998);
+  --t-color-iris3: color(display-p3 0.943 0.945 0.992);
+  --t-color-iris4: color(display-p3 0.902 0.906 1);
+  --t-color-iris5: color(display-p3 0.857 0.861 1);
+  --t-color-iris6: color(display-p3 0.799 0.805 0.987);
+  --t-color-iris7: color(display-p3 0.721 0.727 0.955);
+  --t-color-iris8: color(display-p3 0.61 0.619 0.918);
+  --t-color-iris9: color(display-p3 0.357 0.357 0.81);
+  --t-color-iris10: color(display-p3 0.318 0.318 0.774);
+  --t-color-iris11: color(display-p3 0.337 0.326 0.748);
+  --t-color-iris12: color(display-p3 0.154 0.161 0.371);
+  --t-color-cyan1: color(display-p3 0.982 0.992 0.996);
+  --t-color-cyan2: color(display-p3 0.955 0.981 0.984);
+  --t-color-cyan3: color(display-p3 0.888 0.965 0.975);
+  --t-color-cyan4: color(display-p3 0.821 0.941 0.959);
+  --t-color-cyan5: color(display-p3 0.751 0.907 0.935);
+  --t-color-cyan6: color(display-p3 0.671 0.862 0.9);
+  --t-color-cyan7: color(display-p3 0.564 0.8 0.854);
+  --t-color-cyan8: color(display-p3 0.388 0.715 0.798);
+  --t-color-cyan9: color(display-p3 0.282 0.627 0.765);
+  --t-color-cyan10: color(display-p3 0.264 0.583 0.71);
+  --t-color-cyan11: color(display-p3 0.08 0.48 0.63);
+  --t-color-cyan12: color(display-p3 0.108 0.232 0.277);
+  --t-color-jade1: color(display-p3 0.986 0.996 0.992);
+  --t-color-jade2: color(display-p3 0.962 0.983 0.969);
+  --t-color-jade3: color(display-p3 0.912 0.965 0.932);
+  --t-color-jade4: color(display-p3 0.858 0.941 0.893);
+  --t-color-jade5: color(display-p3 0.795 0.909 0.847);
+  --t-color-jade6: color(display-p3 0.715 0.864 0.791);
+  --t-color-jade7: color(display-p3 0.603 0.802 0.718);
+  --t-color-jade8: color(display-p3 0.44 0.72 0.629);
+  --t-color-jade9: color(display-p3 0.319 0.63 0.521);
+  --t-color-jade10: color(display-p3 0.299 0.592 0.488);
+  --t-color-jade11: color(display-p3 0.15 0.5 0.37);
+  --t-color-jade12: color(display-p3 0.142 0.229 0.194);
+  --t-color-grass1: color(display-p3 0.986 0.996 0.985);
+  --t-color-grass2: color(display-p3 0.966 0.983 0.964);
+  --t-color-grass3: color(display-p3 0.923 0.965 0.917);
+  --t-color-grass4: color(display-p3 0.872 0.94 0.865);
+  --t-color-grass5: color(display-p3 0.811 0.908 0.802);
+  --t-color-grass6: color(display-p3 0.733 0.864 0.724);
+  --t-color-grass7: color(display-p3 0.628 0.803 0.622);
+  --t-color-grass8: color(display-p3 0.477 0.72 0.482);
+  --t-color-grass9: color(display-p3 0.38 0.647 0.378);
+  --t-color-grass10: color(display-p3 0.344 0.598 0.342);
+  --t-color-grass11: color(display-p3 0.263 0.488 0.261);
+  --t-color-grass12: color(display-p3 0.151 0.233 0.153);
+  --t-color-mint1: color(display-p3 0.98 0.995 0.992);
+  --t-color-mint2: color(display-p3 0.957 0.985 0.977);
+  --t-color-mint3: color(display-p3 0.888 0.972 0.95);
+  --t-color-mint4: color(display-p3 0.819 0.951 0.916);
+  --t-color-mint5: color(display-p3 0.747 0.918 0.873);
+  --t-color-mint6: color(display-p3 0.668 0.87 0.818);
+  --t-color-mint7: color(display-p3 0.567 0.805 0.744);
+  --t-color-mint8: color(display-p3 0.42 0.724 0.649);
+  --t-color-mint9: color(display-p3 0.62 0.908 0.834);
+  --t-color-mint10: color(display-p3 0.585 0.871 0.797);
+  --t-color-mint11: color(display-p3 0.203 0.463 0.397);
+  --t-color-mint12: color(display-p3 0.136 0.259 0.236);
+  --t-color-lime1: color(display-p3 0.989 0.992 0.981);
+  --t-color-lime2: color(display-p3 0.975 0.98 0.954);
+  --t-color-lime3: color(display-p3 0.939 0.965 0.851);
+  --t-color-lime4: color(display-p3 0.896 0.94 0.76);
+  --t-color-lime5: color(display-p3 0.843 0.903 0.678);
+  --t-color-lime6: color(display-p3 0.778 0.852 0.599);
+  --t-color-lime7: color(display-p3 0.694 0.784 0.508);
+  --t-color-lime8: color(display-p3 0.585 0.707 0.378);
+  --t-color-lime9: color(display-p3 0.78 0.928 0.466);
+  --t-color-lime10: color(display-p3 0.734 0.896 0.397);
+  --t-color-lime11: color(display-p3 0.386 0.482 0.227);
+  --t-color-lime12: color(display-p3 0.222 0.25 0.128);
+  --t-color-bronze1: color(display-p3 0.991 0.988 0.988);
+  --t-color-bronze2: color(display-p3 0.989 0.97 0.961);
+  --t-color-bronze3: color(display-p3 0.958 0.932 0.919);
+  --t-color-bronze4: color(display-p3 0.929 0.894 0.877);
+  --t-color-bronze5: color(display-p3 0.898 0.853 0.832);
+  --t-color-bronze6: color(display-p3 0.861 0.805 0.778);
+  --t-color-bronze7: color(display-p3 0.812 0.739 0.706);
+  --t-color-bronze8: color(display-p3 0.741 0.647 0.606);
+  --t-color-bronze9: color(display-p3 0.611 0.507 0.455);
+  --t-color-bronze10: color(display-p3 0.563 0.461 0.414);
+  --t-color-bronze11: color(display-p3 0.471 0.373 0.336);
+  --t-color-bronze12: color(display-p3 0.251 0.191 0.172);
+  --t-color-gold1: color(display-p3 0.992 0.992 0.989);
+  --t-color-gold2: color(display-p3 0.98 0.976 0.953);
+  --t-color-gold3: color(display-p3 0.947 0.94 0.909);
+  --t-color-gold4: color(display-p3 0.914 0.904 0.865);
+  --t-color-gold5: color(display-p3 0.88 0.865 0.816);
+  --t-color-gold6: color(display-p3 0.84 0.818 0.756);
+  --t-color-gold7: color(display-p3 0.788 0.753 0.677);
+  --t-color-gold8: color(display-p3 0.715 0.66 0.565);
+  --t-color-gold9: color(display-p3 0.579 0.517 0.41);
+  --t-color-gold10: color(display-p3 0.538 0.479 0.38);
+  --t-color-gold11: color(display-p3 0.433 0.386 0.305);
+  --t-color-gold12: color(display-p3 0.227 0.209 0.173);
+  --t-color-brown1: color(display-p3 0.995 0.992 0.989);
+  --t-color-brown2: color(display-p3 0.987 0.976 0.964);
+  --t-color-brown3: color(display-p3 0.959 0.936 0.909);
+  --t-color-brown4: color(display-p3 0.934 0.897 0.855);
+  --t-color-brown5: color(display-p3 0.909 0.856 0.798);
+  --t-color-brown6: color(display-p3 0.88 0.808 0.73);
+  --t-color-brown7: color(display-p3 0.841 0.742 0.639);
+  --t-color-brown8: color(display-p3 0.782 0.647 0.514);
+  --t-color-brown9: color(display-p3 0.651 0.505 0.368);
+  --t-color-brown10: color(display-p3 0.601 0.465 0.344);
+  --t-color-brown11: color(display-p3 0.485 0.374 0.288);
+  --t-color-brown12: color(display-p3 0.236 0.202 0.183);
+  --t-color-amber1: color(display-p3 0.995 0.992 0.985);
+  --t-color-amber2: color(display-p3 0.994 0.986 0.921);
+  --t-color-amber3: color(display-p3 0.994 0.969 0.782);
+  --t-color-amber4: color(display-p3 0.989 0.937 0.65);
+  --t-color-amber5: color(display-p3 0.97 0.902 0.527);
+  --t-color-amber6: color(display-p3 0.936 0.844 0.506);
+  --t-color-amber7: color(display-p3 0.89 0.762 0.443);
+  --t-color-amber8: color(display-p3 0.85 0.65 0.3);
+  --t-color-amber9: color(display-p3 1 0.77 0.26);
+  --t-color-amber10: color(display-p3 0.959 0.741 0.274);
+  --t-color-amber11: color(display-p3 0.64 0.4 0);
+  --t-color-amber12: color(display-p3 0.294 0.208 0.145);
+  --t-color-transparent-green1: #00c04004;
+  --t-color-transparent-green2: #00a32f0b;
+  --t-color-transparent-green3: #00a43319;
+  --t-color-transparent-green4: #00a83829;
+  --t-color-transparent-green5: #019c393b;
+  --t-color-transparent-green6: #00963c52;
+  --t-color-transparent-green7: #00914071;
+  --t-color-transparent-green8: #00924ba4;
+  --t-color-transparent-green9: #008f4acf;
+  --t-color-transparent-green10: #008647d4;
+  --t-color-transparent-green11: #00713fde;
+  --t-color-transparent-green12: #002616e6;
+  --t-color-transparent-turquoise1: #00cc9905;
+  --t-color-transparent-turquoise2: #00aa800c;
+  --t-color-transparent-turquoise3: #00c69d1f;
+  --t-color-transparent-turquoise4: #00c39633;
+  --t-color-transparent-turquoise5: #00b49047;
+  --t-color-transparent-turquoise6: #00a6855e;
+  --t-color-transparent-turquoise7: #0099807c;
+  --t-color-transparent-turquoise8: #009783ac;
+  --t-color-transparent-turquoise9: #009e8ced;
+  --t-color-transparent-turquoise10: #009684f2;
+  --t-color-transparent-turquoise11: #008573;
+  --t-color-transparent-turquoise12: #00332df2;
+  --t-color-transparent-sky1: #00d5ff06;
+  --t-color-transparent-sky2: #00a4db0e;
+  --t-color-transparent-sky3: #00b3ee1e;
+  --t-color-transparent-sky4: #00ace42e;
+  --t-color-transparent-sky5: #00a1d841;
+  --t-color-transparent-sky6: #0092ca56;
+  --t-color-transparent-sky7: #0089c172;
+  --t-color-transparent-sky8: #0085bf9f;
+  --t-color-transparent-sky9: #00c7fe83;
+  --t-color-transparent-sky10: #00bcf38b;
+  --t-color-transparent-sky11: #00749e;
+  --t-color-transparent-sky12: #002540e2;
+  --t-color-transparent-blue1: #00008002;
+  --t-color-transparent-blue2: #0040ff08;
+  --t-color-transparent-blue3: #0047f112;
+  --t-color-transparent-blue4: #0044ff1e;
+  --t-color-transparent-blue5: #0044ff2d;
+  --t-color-transparent-blue6: #003eff3e;
+  --t-color-transparent-blue7: #0037ed54;
+  --t-color-transparent-blue8: #0034dc72;
+  --t-color-transparent-blue9: #0031d2c1;
+  --t-color-transparent-blue10: #002ec9cc;
+  --t-color-transparent-blue11: #002bb7c5;
+  --t-color-transparent-blue12: #001046e0;
+  --t-color-transparent-purple1: #aa00aa03;
+  --t-color-transparent-purple2: #8000e008;
+  --t-color-transparent-purple3: #8e00f112;
+  --t-color-transparent-purple4: #8d00e51d;
+  --t-color-transparent-purple5: #8000db2a;
+  --t-color-transparent-purple6: #7a01d03b;
+  --t-color-transparent-purple7: #6d00c350;
+  --t-color-transparent-purple8: #6600c06c;
+  --t-color-transparent-purple9: #5c00adb1;
+  --t-color-transparent-purple10: #53009eb8;
+  --t-color-transparent-purple11: #52009aba;
+  --t-color-transparent-purple12: #250049df;
+  --t-color-transparent-pink1: #ff00aa03;
+  --t-color-transparent-pink2: #e0008008;
+  --t-color-transparent-pink3: #f4008c16;
+  --t-color-transparent-pink4: #e2008b23;
+  --t-color-transparent-pink5: #d1008331;
+  --t-color-transparent-pink6: #c0007840;
+  --t-color-transparent-pink7: #b6006f53;
+  --t-color-transparent-pink8: #af006f6c;
+  --t-color-transparent-pink9: #c8007fbf;
+  --t-color-transparent-pink10: #c2007ac7;
+  --t-color-transparent-pink11: #b60074d6;
+  --t-color-transparent-pink12: #59003bed;
+  --t-color-transparent-red1: #ff000003;
+  --t-color-transparent-red2: #ff000008;
+  --t-color-transparent-red3: #f3000d14;
+  --t-color-transparent-red4: #ff000824;
+  --t-color-transparent-red5: #ff000632;
+  --t-color-transparent-red6: #f8000442;
+  --t-color-transparent-red7: #df000356;
+  --t-color-transparent-red8: #d2000571;
+  --t-color-transparent-red9: #db0007b7;
+  --t-color-transparent-red10: #d10005c1;
+  --t-color-transparent-red11: #c40006d3;
+  --t-color-transparent-red12: #55000de8;
+  --t-color-transparent-orange1: #c0400004;
+  --t-color-transparent-orange2: #ff8e0012;
+  --t-color-transparent-orange3: #ff9c0029;
+  --t-color-transparent-orange4: #ff91014a;
+  --t-color-transparent-orange5: #ff8b0065;
+  --t-color-transparent-orange6: #ff81007d;
+  --t-color-transparent-orange7: #ed6c008c;
+  --t-color-transparent-orange8: #e35f00aa;
+  --t-color-transparent-orange9: #f65e00ea;
+  --t-color-transparent-orange10: #ef5f00;
+  --t-color-transparent-orange11: #cc4e00;
+  --t-color-transparent-orange12: #431200e2;
+  --t-color-transparent-yellow1: #aaaa0006;
+  --t-color-transparent-yellow2: #f4dd0016;
+  --t-color-transparent-yellow3: #ffee0047;
+  --t-color-transparent-yellow4: #ffe3016b;
+  --t-color-transparent-yellow5: #ffd5008f;
+  --t-color-transparent-yellow6: #ebbc0097;
+  --t-color-transparent-yellow7: #d2a10098;
+  --t-color-transparent-yellow8: #c99700c6;
+  --t-color-transparent-yellow9: #ffe100d6;
+  --t-color-transparent-yellow10: #ffdc00;
+  --t-color-transparent-yellow11: #9e6c00;
+  --t-color-transparent-yellow12: #2e2000e0;
+  --t-color-transparent-gray1: color(display-p3 0 0 0 / 0.02);
+  --t-color-transparent-gray2: color(display-p3 0 0 0 / 0.039);
+  --t-color-transparent-gray3: color(display-p3 0 0 0 / 0.047);
+  --t-color-transparent-gray4: color(display-p3 0 0 0 / 0.071);
+  --t-color-transparent-gray5: color(display-p3 0 0 0 / 0.078);
+  --t-color-transparent-gray6: color(display-p3 0 0 0 / 0.114);
+  --t-color-transparent-gray7: color(display-p3 0 0 0 / 0.161);
+  --t-color-transparent-gray8: color(display-p3 0 0 0 / 0.22);
+  --t-color-transparent-gray9: color(display-p3 0 0 0 / 0.361);
+  --t-color-transparent-gray10: color(display-p3 0 0 0 / 0.478);
+  --t-color-transparent-gray11: color(display-p3 0 0 0 / 0.722);
+  --t-color-transparent-gray12: color(display-p3 0 0 0 / 0.91);
+  --t-color-transparent-mauve1: #55005503;
+  --t-color-transparent-mauve2: #2b005506;
+  --t-color-transparent-mauve3: #30004010;
+  --t-color-transparent-mauve4: #20003618;
+  --t-color-transparent-mauve5: #20003820;
+  --t-color-transparent-mauve6: #14003527;
+  --t-color-transparent-mauve7: #10003332;
+  --t-color-transparent-mauve8: #08003145;
+  --t-color-transparent-mauve9: #05001d73;
+  --t-color-transparent-mauve10: #0500197d;
+  --t-color-transparent-mauve11: #0400119c;
+  --t-color-transparent-mauve12: #020008e0;
+  --t-color-transparent-slate1: #00005503;
+  --t-color-transparent-slate2: #00005506;
+  --t-color-transparent-slate3: #0000330f;
+  --t-color-transparent-slate4: #00002d17;
+  --t-color-transparent-slate5: #0009321f;
+  --t-color-transparent-slate6: #00002f26;
+  --t-color-transparent-slate7: #00062e32;
+  --t-color-transparent-slate8: #00083046;
+  --t-color-transparent-slate9: #00051d74;
+  --t-color-transparent-slate10: #00071b7f;
+  --t-color-transparent-slate11: #0007149f;
+  --t-color-transparent-slate12: #000509e3;
+  --t-color-transparent-sage1: #00804004;
+  --t-color-transparent-sage2: #00402008;
+  --t-color-transparent-sage3: #002d1e11;
+  --t-color-transparent-sage4: #001f1519;
+  --t-color-transparent-sage5: #00180820;
+  --t-color-transparent-sage6: #00140d28;
+  --t-color-transparent-sage7: #00140a34;
+  --t-color-transparent-sage8: #000f0847;
+  --t-color-transparent-sage9: #00110b79;
+  --t-color-transparent-sage10: #00100a83;
+  --t-color-transparent-sage11: #000a07a0;
+  --t-color-transparent-sage12: #000805e5;
+  --t-color-transparent-olive1: #00550003;
+  --t-color-transparent-olive2: #00490007;
+  --t-color-transparent-olive3: #00200010;
+  --t-color-transparent-olive4: #00160018;
+  --t-color-transparent-olive5: #00180020;
+  --t-color-transparent-olive6: #00140028;
+  --t-color-transparent-olive7: #000f0033;
+  --t-color-transparent-olive8: #040f0047;
+  --t-color-transparent-olive9: #050f0078;
+  --t-color-transparent-olive10: #040e0082;
+  --t-color-transparent-olive11: #020a00a0;
+  --t-color-transparent-olive12: #010600e3;
+  --t-color-transparent-sand1: #55550003;
+  --t-color-transparent-sand2: #25250007;
+  --t-color-transparent-sand3: #20100010;
+  --t-color-transparent-sand4: #1f150019;
+  --t-color-transparent-sand5: #1f180021;
+  --t-color-transparent-sand6: #19130029;
+  --t-color-transparent-sand7: #19140035;
+  --t-color-transparent-sand8: #1915014a;
+  --t-color-transparent-sand9: #0f0f0079;
+  --t-color-transparent-sand10: #0c0c0083;
+  --t-color-transparent-sand11: #080800a1;
+  --t-color-transparent-sand12: #060500e3;
+  --t-color-transparent-tomato1: #ff000003;
+  --t-color-transparent-tomato2: #ff200008;
+  --t-color-transparent-tomato3: #f52b0018;
+  --t-color-transparent-tomato4: #ff35002c;
+  --t-color-transparent-tomato5: #ff2e003d;
+  --t-color-transparent-tomato6: #f92d0050;
+  --t-color-transparent-tomato7: #e7280067;
+  --t-color-transparent-tomato8: #db250084;
+  --t-color-transparent-tomato9: #df2600d1;
+  --t-color-transparent-tomato10: #d72400da;
+  --t-color-transparent-tomato11: #cd2200ea;
+  --t-color-transparent-tomato12: #460900e0;
+  --t-color-transparent-ruby1: #ff005503;
+  --t-color-transparent-ruby2: #ff002008;
+  --t-color-transparent-ruby3: #f3002515;
+  --t-color-transparent-ruby4: #ff002523;
+  --t-color-transparent-ruby5: #ff002a31;
+  --t-color-transparent-ruby6: #e4002440;
+  --t-color-transparent-ruby7: #ce002553;
+  --t-color-transparent-ruby8: #c300286d;
+  --t-color-transparent-ruby9: #db002cb9;
+  --t-color-transparent-ruby10: #d2002cc4;
+  --t-color-transparent-ruby11: #c10030db;
+  --t-color-transparent-ruby12: #550016e8;
+  --t-color-transparent-crimson1: #ff005503;
+  --t-color-transparent-crimson2: #e0004008;
+  --t-color-transparent-crimson3: #ff005216;
+  --t-color-transparent-crimson4: #f8005123;
+  --t-color-transparent-crimson5: #e5004f31;
+  --t-color-transparent-crimson6: #d0004b41;
+  --t-color-transparent-crimson7: #bf004753;
+  --t-color-transparent-crimson8: #b6004a6c;
+  --t-color-transparent-crimson9: #e2005bc2;
+  --t-color-transparent-crimson10: #d70056cb;
+  --t-color-transparent-crimson11: #c4004fe2;
+  --t-color-transparent-crimson12: #530026e9;
+  --t-color-transparent-plum1: #aa00ff03;
+  --t-color-transparent-plum2: #c000c008;
+  --t-color-transparent-plum3: #cc00cc14;
+  --t-color-transparent-plum4: #c200c921;
+  --t-color-transparent-plum5: #b700bd2e;
+  --t-color-transparent-plum6: #a400b03d;
+  --t-color-transparent-plum7: #9900a852;
+  --t-color-transparent-plum8: #9000a56e;
+  --t-color-transparent-plum9: #89009eb5;
+  --t-color-transparent-plum10: #7f0092bb;
+  --t-color-transparent-plum11: #730086c1;
+  --t-color-transparent-plum12: #40004be6;
+  --t-color-transparent-violet1: #5500aa03;
+  --t-color-transparent-violet2: #4900ff07;
+  --t-color-transparent-violet3: #4400ee0f;
+  --t-color-transparent-violet4: #4300ff1b;
+  --t-color-transparent-violet5: #3600ff26;
+  --t-color-transparent-violet6: #3100fb35;
+  --t-color-transparent-violet7: #2d01dd4a;
+  --t-color-transparent-violet8: #2b00d066;
+  --t-color-transparent-violet9: #2400b7a9;
+  --t-color-transparent-violet10: #2300abb2;
+  --t-color-transparent-violet11: #1f0099af;
+  --t-color-transparent-violet12: #0b0043d9;
+  --t-color-transparent-iris1: #0000ff02;
+  --t-color-transparent-iris2: #0000ff07;
+  --t-color-transparent-iris3: #0011ee0f;
+  --t-color-transparent-iris4: #000bff19;
+  --t-color-transparent-iris5: #000eff25;
+  --t-color-transparent-iris6: #000aff34;
+  --t-color-transparent-iris7: #0008e647;
+  --t-color-transparent-iris8: #0008d964;
+  --t-color-transparent-iris9: #0000c0a4;
+  --t-color-transparent-iris10: #0000b6ae;
+  --t-color-transparent-iris11: #0600abac;
+  --t-color-transparent-iris12: #000246d8;
+  --t-color-transparent-cyan1: #0099cc05;
+  --t-color-transparent-cyan2: #009db10d;
+  --t-color-transparent-cyan3: #00c2d121;
+  --t-color-transparent-cyan4: #00bcd435;
+  --t-color-transparent-cyan5: #01b4cc4a;
+  --t-color-transparent-cyan6: #00a7c162;
+  --t-color-transparent-cyan7: #009fbb82;
+  --t-color-transparent-cyan8: #00a3c0c2;
+  --t-color-transparent-cyan9: #00a2c7;
+  --t-color-transparent-cyan10: #0094b7f8;
+  --t-color-transparent-cyan11: #007491ef;
+  --t-color-transparent-cyan12: #00323ef2;
+  --t-color-transparent-jade1: #00c08004;
+  --t-color-transparent-jade2: #00a3460b;
+  --t-color-transparent-jade3: #00ae4819;
+  --t-color-transparent-jade4: #00a85129;
+  --t-color-transparent-jade5: #00a2553c;
+  --t-color-transparent-jade6: #009a5753;
+  --t-color-transparent-jade7: #00945f74;
+  --t-color-transparent-jade8: #00976ea9;
+  --t-color-transparent-jade9: #00916bd6;
+  --t-color-transparent-jade10: #008764d9;
+  --t-color-transparent-jade11: #007152df;
+  --t-color-transparent-jade12: #002217e2;
+  --t-color-transparent-grass1: #00c00004;
+  --t-color-transparent-grass2: #0099000a;
+  --t-color-transparent-grass3: #00970016;
+  --t-color-transparent-grass4: #009f0725;
+  --t-color-transparent-grass5: #00930536;
+  --t-color-transparent-grass6: #008f0a4d;
+  --t-color-transparent-grass7: #018b0f6b;
+  --t-color-transparent-grass8: #008d199a;
+  --t-color-transparent-grass9: #008619b9;
+  --t-color-transparent-grass10: #007b17c1;
+  --t-color-transparent-grass11: #006514d5;
+  --t-color-transparent-grass12: #002006df;
+  --t-color-transparent-mint1: #00d5aa06;
+  --t-color-transparent-mint2: #00b18a0d;
+  --t-color-transparent-mint3: #00d29e22;
+  --t-color-transparent-mint4: #00cc9937;
+  --t-color-transparent-mint5: #00c0914c;
+  --t-color-transparent-mint6: #00b08663;
+  --t-color-transparent-mint7: #00a17d81;
+  --t-color-transparent-mint8: #009e7fb3;
+  --t-color-transparent-mint9: #00d3a579;
+  --t-color-transparent-mint10: #00c39982;
+  --t-color-transparent-mint11: #007763fd;
+  --t-color-transparent-mint12: #00312ae9;
+  --t-color-transparent-lime1: #66990005;
+  --t-color-transparent-lime2: #6b95000c;
+  --t-color-transparent-lime3: #96c80029;
+  --t-color-transparent-lime4: #8fc60042;
+  --t-color-transparent-lime5: #81bb0059;
+  --t-color-transparent-lime6: #72aa006e;
+  --t-color-transparent-lime7: #61990087;
+  --t-color-transparent-lime8: #559200ab;
+  --t-color-transparent-lime9: #93e4009c;
+  --t-color-transparent-lime10: #8fdc00b3;
+  --t-color-transparent-lime11: #375f00d0;
+  --t-color-transparent-lime12: #1e2900e3;
+  --t-color-transparent-bronze1: #55000003;
+  --t-color-transparent-bronze2: #cc33000a;
+  --t-color-transparent-bronze3: #92250015;
+  --t-color-transparent-bronze4: #80280020;
+  --t-color-transparent-bronze5: #7423002c;
+  --t-color-transparent-bronze6: #7324003a;
+  --t-color-transparent-bronze7: #6c1f004c;
+  --t-color-transparent-bronze8: #671c0066;
+  --t-color-transparent-bronze9: #551a008d;
+  --t-color-transparent-bronze10: #4c150097;
+  --t-color-transparent-bronze11: #3d0f00ab;
+  --t-color-transparent-bronze12: #1d0600d4;
+  --t-color-transparent-gold1: #55550003;
+  --t-color-transparent-gold2: #9d8a000d;
+  --t-color-transparent-gold3: #75600018;
+  --t-color-transparent-gold4: #6b4e0024;
+  --t-color-transparent-gold5: #60460030;
+  --t-color-transparent-gold6: #64440040;
+  --t-color-transparent-gold7: #63420055;
+  --t-color-transparent-gold8: #633d0072;
+  --t-color-transparent-gold9: #5332009a;
+  --t-color-transparent-gold10: #492d00a1;
+  --t-color-transparent-gold11: #362100b4;
+  --t-color-transparent-gold12: #130c00d4;
+  --t-color-transparent-brown1: #aa550003;
+  --t-color-transparent-brown2: #aa550009;
+  --t-color-transparent-brown3: #a04b0018;
+  --t-color-transparent-brown4: #9b4a0026;
+  --t-color-transparent-brown5: #9f4d0035;
+  --t-color-transparent-brown6: #a04e0048;
+  --t-color-transparent-brown7: #a34e0060;
+  --t-color-transparent-brown8: #9f4a0081;
+  --t-color-transparent-brown9: #823c00a7;
+  --t-color-transparent-brown10: #723300ac;
+  --t-color-transparent-brown11: #522100b9;
+  --t-color-transparent-brown12: #140600d1;
+  --t-color-transparent-amber1: #c0800004;
+  --t-color-transparent-amber2: #f4d10016;
+  --t-color-transparent-amber3: #ffde003d;
+  --t-color-transparent-amber4: #ffd40063;
+  --t-color-transparent-amber5: #f8cf0088;
+  --t-color-transparent-amber6: #eab5008c;
+  --t-color-transparent-amber7: #dc9b009d;
+  --t-color-transparent-amber8: #da8a00c9;
+  --t-color-transparent-amber9: #ffb300c2;
+  --t-color-transparent-amber10: #ffb300e7;
+  --t-color-transparent-amber11: #ab6400;
+  --t-color-transparent-amber12: #341500dd;
+}
diff --git a/packages/twenty-new-ui/src/theme-constants/themeCssVariables.ts b/packages/twenty-new-ui/src/theme-constants/themeCssVariables.ts
new file mode 100644
index 00000000000..fac62cc1da0
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme-constants/themeCssVariables.ts
@@ -0,0 +1,1090 @@
+// Theme CSS variable accessor, mirrored token-for-token from twenty-ui.
+// Kept in sync by the theme parity test (src/theme-constants/__tests__).
+export const themeCssVariables = {
+  icon: {
+    size: {
+      sm: 'var(--t-icon-size-sm)',
+      md: 'var(--t-icon-size-md)',
+      lg: 'var(--t-icon-size-lg)',
+      xl: 'var(--t-icon-size-xl)',
+    },
+    stroke: {
+      sm: 'var(--t-icon-stroke-sm)',
+      md: 'var(--t-icon-stroke-md)',
+      lg: 'var(--t-icon-stroke-lg)',
+    },
+  },
+  modal: {
+    size: {
+      sm: {
+        width: 'var(--t-modal-size-sm-width)',
+      },
+      md: {
+        width: 'var(--t-modal-size-md-width)',
+      },
+      lg: {
+        width: 'var(--t-modal-size-lg-width)',
+      },
+      xl: {
+        width: 'var(--t-modal-size-xl-width)',
+        height: 'var(--t-modal-size-xl-height)',
+      },
+      fullscreen: {
+        width: 'var(--t-modal-size-fullscreen-width)',
+        height: 'var(--t-modal-size-fullscreen-height)',
+      },
+    },
+  },
+  text: {
+    lineHeight: {
+      lg: 'var(--t-text-line-height-lg)',
+      md: 'var(--t-text-line-height-md)',
+    },
+    iconSizeMedium: 'var(--t-text-icon-size-medium)',
+    iconSizeSmall: 'var(--t-text-icon-size-small)',
+    iconStrikeLight: 'var(--t-text-icon-strike-light)',
+    iconStrikeMedium: 'var(--t-text-icon-strike-medium)',
+    iconStrikeBold: 'var(--t-text-icon-strike-bold)',
+  },
+  animation: {
+    duration: {
+      instant: 'var(--t-animation-duration-instant)',
+      fast: 'var(--t-animation-duration-fast)',
+      normal: 'var(--t-animation-duration-normal)',
+      slow: 'var(--t-animation-duration-slow)',
+    },
+  },
+  spacingMultiplicator: 'var(--t-spacing-multiplicator)',
+  spacing: {
+    '0': 'var(--t-spacing-0)',
+    '1': 'var(--t-spacing-1)',
+    '2': 'var(--t-spacing-2)',
+    '3': 'var(--t-spacing-3)',
+    '4': 'var(--t-spacing-4)',
+    '5': 'var(--t-spacing-5)',
+    '6': 'var(--t-spacing-6)',
+    '7': 'var(--t-spacing-7)',
+    '8': 'var(--t-spacing-8)',
+    '9': 'var(--t-spacing-9)',
+    '10': 'var(--t-spacing-10)',
+    '11': 'var(--t-spacing-11)',
+    '12': 'var(--t-spacing-12)',
+    '13': 'var(--t-spacing-13)',
+    '14': 'var(--t-spacing-14)',
+    '15': 'var(--t-spacing-15)',
+    '16': 'var(--t-spacing-16)',
+    '17': 'var(--t-spacing-17)',
+    '18': 'var(--t-spacing-18)',
+    '19': 'var(--t-spacing-19)',
+    '20': 'var(--t-spacing-20)',
+    '21': 'var(--t-spacing-21)',
+    '22': 'var(--t-spacing-22)',
+    '23': 'var(--t-spacing-23)',
+    '24': 'var(--t-spacing-24)',
+    '25': 'var(--t-spacing-25)',
+    '26': 'var(--t-spacing-26)',
+    '27': 'var(--t-spacing-27)',
+    '28': 'var(--t-spacing-28)',
+    '29': 'var(--t-spacing-29)',
+    '30': 'var(--t-spacing-30)',
+    '31': 'var(--t-spacing-31)',
+    '32': 'var(--t-spacing-32)',
+    '0.5': 'var(--t-spacing-0_5)',
+    '1.5': 'var(--t-spacing-1_5)',
+  },
+  betweenSiblingsGap: 'var(--t-between-siblings-gap)',
+  table: {
+    horizontalCellMargin: 'var(--t-table-horizontal-cell-margin)',
+    checkboxColumnWidth: 'var(--t-table-checkbox-column-width)',
+    horizontalCellPadding: 'var(--t-table-horizontal-cell-padding)',
+  },
+  sidePanelWidth: 'var(--t-side-panel-width)',
+  clickableElementBackgroundTransition:
+    'var(--t-clickable-element-background-transition)',
+  lastLayerZIndex: 'var(--t-last-layer-z-index)',
+  buttons: {
+    secondaryTextColor: 'var(--t-buttons-secondary-text-color)',
+  },
+  accent: {
+    primary: 'var(--t-accent-primary)',
+    secondary: 'var(--t-accent-secondary)',
+    tertiary: 'var(--t-accent-tertiary)',
+    quaternary: 'var(--t-accent-quaternary)',
+    accent3570: 'var(--t-accent-accent3570)',
+    accent4060: 'var(--t-accent-accent4060)',
+    accent1: 'var(--t-accent-accent1)',
+    accent2: 'var(--t-accent-accent2)',
+    accent3: 'var(--t-accent-accent3)',
+    accent4: 'var(--t-accent-accent4)',
+    accent5: 'var(--t-accent-accent5)',
+    accent6: 'var(--t-accent-accent6)',
+    accent7: 'var(--t-accent-accent7)',
+    accent8: 'var(--t-accent-accent8)',
+    accent9: 'var(--t-accent-accent9)',
+    accent10: 'var(--t-accent-accent10)',
+    accent11: 'var(--t-accent-accent11)',
+    accent12: 'var(--t-accent-accent12)',
+  },
+  background: {
+    noisy: 'var(--t-background-noisy)',
+    primary: 'var(--t-background-primary)',
+    secondary: 'var(--t-background-secondary)',
+    tertiary: 'var(--t-background-tertiary)',
+    quaternary: 'var(--t-background-quaternary)',
+    invertedPrimary: 'var(--t-background-inverted-primary)',
+    invertedSecondary: 'var(--t-background-inverted-secondary)',
+    danger: 'var(--t-background-danger)',
+    transparent: {
+      primary: 'var(--t-background-transparent-primary)',
+      secondary: 'var(--t-background-transparent-secondary)',
+      strong: 'var(--t-background-transparent-strong)',
+      medium: 'var(--t-background-transparent-medium)',
+      light: 'var(--t-background-transparent-light)',
+      lighter: 'var(--t-background-transparent-lighter)',
+      danger: 'var(--t-background-transparent-danger)',
+      blue: 'var(--t-background-transparent-blue)',
+      orange: 'var(--t-background-transparent-orange)',
+      success: 'var(--t-background-transparent-success)',
+    },
+    overlayPrimary: 'var(--t-background-overlay-primary)',
+    overlaySecondary: 'var(--t-background-overlay-secondary)',
+    overlayTertiary: 'var(--t-background-overlay-tertiary)',
+    radialGradient: 'var(--t-background-radial-gradient)',
+    radialGradientHover: 'var(--t-background-radial-gradient-hover)',
+    primaryInverted: 'var(--t-background-primary-inverted)',
+    primaryInvertedHover: 'var(--t-background-primary-inverted-hover)',
+  },
+  blur: {
+    light: 'var(--t-blur-light)',
+    medium: 'var(--t-blur-medium)',
+    strong: 'var(--t-blur-strong)',
+  },
+  border: {
+    color: {
+      strong: 'var(--t-border-color-strong)',
+      medium: 'var(--t-border-color-medium)',
+      light: 'var(--t-border-color-light)',
+      secondaryInverted: 'var(--t-border-color-secondary-inverted)',
+      inverted: 'var(--t-border-color-inverted)',
+      danger: 'var(--t-border-color-danger)',
+      blue: 'var(--t-border-color-blue)',
+      transparentStrong: 'var(--t-border-color-transparent-strong)',
+    },
+    radius: {
+      xs: 'var(--t-border-radius-xs)',
+      sm: 'var(--t-border-radius-sm)',
+      md: 'var(--t-border-radius-md)',
+      xl: 'var(--t-border-radius-xl)',
+      xxl: 'var(--t-border-radius-xxl)',
+      pill: 'var(--t-border-radius-pill)',
+      rounded: 'var(--t-border-radius-rounded)',
+    },
+  },
+  boxShadow: {
+    color: 'var(--t-box-shadow-color)',
+    light: 'var(--t-box-shadow-light)',
+    strong: 'var(--t-box-shadow-strong)',
+    underline: 'var(--t-box-shadow-underline)',
+    superHeavy: 'var(--t-box-shadow-super-heavy)',
+  },
+  font: {
+    color: {
+      primary: 'var(--t-font-color-primary)',
+      secondary: 'var(--t-font-color-secondary)',
+      tertiary: 'var(--t-font-color-tertiary)',
+      light: 'var(--t-font-color-light)',
+      extraLight: 'var(--t-font-color-extra-light)',
+      inverted: 'var(--t-font-color-inverted)',
+      danger: 'var(--t-font-color-danger)',
+    },
+    size: {
+      xxs: 'var(--t-font-size-xxs)',
+      xs: 'var(--t-font-size-xs)',
+      sm: 'var(--t-font-size-sm)',
+      md: 'var(--t-font-size-md)',
+      lg: 'var(--t-font-size-lg)',
+      xl: 'var(--t-font-size-xl)',
+      xxl: 'var(--t-font-size-xxl)',
+    },
+    weight: {
+      regular: 'var(--t-font-weight-regular)',
+      medium: 'var(--t-font-weight-medium)',
+      semiBold: 'var(--t-font-weight-semi-bold)',
+    },
+    family: 'var(--t-font-family)',
+  },
+  name: 'var(--t-name)',
+  snackBar: {
+    success: {
+      color: 'var(--t-snack-bar-success-color)',
+      backgroundColor: 'var(--t-snack-bar-success-background-color)',
+    },
+    error: {
+      color: 'var(--t-snack-bar-error-color)',
+      backgroundColor: 'var(--t-snack-bar-error-background-color)',
+    },
+    warning: {
+      color: 'var(--t-snack-bar-warning-color)',
+      backgroundColor: 'var(--t-snack-bar-warning-background-color)',
+    },
+    info: {
+      color: 'var(--t-snack-bar-info-color)',
+      backgroundColor: 'var(--t-snack-bar-info-background-color)',
+    },
+    default: {
+      color: 'var(--t-snack-bar-default-color)',
+      backgroundColor: 'var(--t-snack-bar-default-background-color)',
+    },
+  },
+  tag: {
+    text: {
+      gray: 'var(--t-tag-text-gray)',
+      mauve: 'var(--t-tag-text-mauve)',
+      slate: 'var(--t-tag-text-slate)',
+      sage: 'var(--t-tag-text-sage)',
+      olive: 'var(--t-tag-text-olive)',
+      sand: 'var(--t-tag-text-sand)',
+      tomato: 'var(--t-tag-text-tomato)',
+      red: 'var(--t-tag-text-red)',
+      ruby: 'var(--t-tag-text-ruby)',
+      crimson: 'var(--t-tag-text-crimson)',
+      pink: 'var(--t-tag-text-pink)',
+      plum: 'var(--t-tag-text-plum)',
+      purple: 'var(--t-tag-text-purple)',
+      violet: 'var(--t-tag-text-violet)',
+      iris: 'var(--t-tag-text-iris)',
+      cyan: 'var(--t-tag-text-cyan)',
+      turquoise: 'var(--t-tag-text-turquoise)',
+      sky: 'var(--t-tag-text-sky)',
+      blue: 'var(--t-tag-text-blue)',
+      jade: 'var(--t-tag-text-jade)',
+      green: 'var(--t-tag-text-green)',
+      grass: 'var(--t-tag-text-grass)',
+      mint: 'var(--t-tag-text-mint)',
+      lime: 'var(--t-tag-text-lime)',
+      bronze: 'var(--t-tag-text-bronze)',
+      gold: 'var(--t-tag-text-gold)',
+      brown: 'var(--t-tag-text-brown)',
+      orange: 'var(--t-tag-text-orange)',
+      amber: 'var(--t-tag-text-amber)',
+      yellow: 'var(--t-tag-text-yellow)',
+    },
+    background: {
+      gray: 'var(--t-tag-background-gray)',
+      mauve: 'var(--t-tag-background-mauve)',
+      slate: 'var(--t-tag-background-slate)',
+      sage: 'var(--t-tag-background-sage)',
+      olive: 'var(--t-tag-background-olive)',
+      sand: 'var(--t-tag-background-sand)',
+      tomato: 'var(--t-tag-background-tomato)',
+      red: 'var(--t-tag-background-red)',
+      ruby: 'var(--t-tag-background-ruby)',
+      crimson: 'var(--t-tag-background-crimson)',
+      pink: 'var(--t-tag-background-pink)',
+      plum: 'var(--t-tag-background-plum)',
+      purple: 'var(--t-tag-background-purple)',
+      violet: 'var(--t-tag-background-violet)',
+      iris: 'var(--t-tag-background-iris)',
+      cyan: 'var(--t-tag-background-cyan)',
+      turquoise: 'var(--t-tag-background-turquoise)',
+      sky: 'var(--t-tag-background-sky)',
+      blue: 'var(--t-tag-background-blue)',
+      jade: 'var(--t-tag-background-jade)',
+      green: 'var(--t-tag-background-green)',
+      grass: 'var(--t-tag-background-grass)',
+      mint: 'var(--t-tag-background-mint)',
+      lime: 'var(--t-tag-background-lime)',
+      bronze: 'var(--t-tag-background-bronze)',
+      gold: 'var(--t-tag-background-gold)',
+      brown: 'var(--t-tag-background-brown)',
+      orange: 'var(--t-tag-background-orange)',
+      amber: 'var(--t-tag-background-amber)',
+      yellow: 'var(--t-tag-background-yellow)',
+    },
+  },
+  code: {
+    text: {
+      gray: 'var(--t-code-text-gray)',
+      sky: 'var(--t-code-text-sky)',
+      pink: 'var(--t-code-text-pink)',
+      orange: 'var(--t-code-text-orange)',
+      green: 'var(--t-code-text-green)',
+    },
+    font: {
+      family: 'var(--t-code-font-family)',
+    },
+  },
+  IllustrationIcon: {
+    color: {
+      blue: 'var(--t--illustration-icon-color-blue)',
+      gray: 'var(--t--illustration-icon-color-gray)',
+    },
+    fill: {
+      blue: 'var(--t--illustration-icon-fill-blue)',
+      gray: 'var(--t--illustration-icon-fill-gray)',
+    },
+  },
+  grayScale: {
+    gray1: 'var(--t-gray-scale-gray1)',
+    gray2: 'var(--t-gray-scale-gray2)',
+    gray3: 'var(--t-gray-scale-gray3)',
+    gray4: 'var(--t-gray-scale-gray4)',
+    gray5: 'var(--t-gray-scale-gray5)',
+    gray6: 'var(--t-gray-scale-gray6)',
+    gray7: 'var(--t-gray-scale-gray7)',
+    gray8: 'var(--t-gray-scale-gray8)',
+    gray9: 'var(--t-gray-scale-gray9)',
+    gray10: 'var(--t-gray-scale-gray10)',
+    gray11: 'var(--t-gray-scale-gray11)',
+    gray12: 'var(--t-gray-scale-gray12)',
+  },
+  color: {
+    red: 'var(--t-color-red)',
+    ruby: 'var(--t-color-ruby)',
+    crimson: 'var(--t-color-crimson)',
+    tomato: 'var(--t-color-tomato)',
+    orange: 'var(--t-color-orange)',
+    amber: 'var(--t-color-amber)',
+    yellow: 'var(--t-color-yellow)',
+    lime: 'var(--t-color-lime)',
+    grass: 'var(--t-color-grass)',
+    green: 'var(--t-color-green)',
+    jade: 'var(--t-color-jade)',
+    mint: 'var(--t-color-mint)',
+    turquoise: 'var(--t-color-turquoise)',
+    cyan: 'var(--t-color-cyan)',
+    sky: 'var(--t-color-sky)',
+    blue: 'var(--t-color-blue)',
+    iris: 'var(--t-color-iris)',
+    violet: 'var(--t-color-violet)',
+    purple: 'var(--t-color-purple)',
+    plum: 'var(--t-color-plum)',
+    pink: 'var(--t-color-pink)',
+    bronze: 'var(--t-color-bronze)',
+    gold: 'var(--t-color-gold)',
+    brown: 'var(--t-color-brown)',
+    gray: 'var(--t-color-gray)',
+    yellow1: 'var(--t-color-yellow1)',
+    yellow2: 'var(--t-color-yellow2)',
+    yellow3: 'var(--t-color-yellow3)',
+    yellow4: 'var(--t-color-yellow4)',
+    yellow5: 'var(--t-color-yellow5)',
+    yellow6: 'var(--t-color-yellow6)',
+    yellow7: 'var(--t-color-yellow7)',
+    yellow8: 'var(--t-color-yellow8)',
+    yellow9: 'var(--t-color-yellow9)',
+    yellow10: 'var(--t-color-yellow10)',
+    yellow11: 'var(--t-color-yellow11)',
+    yellow12: 'var(--t-color-yellow12)',
+    green1: 'var(--t-color-green1)',
+    green2: 'var(--t-color-green2)',
+    green3: 'var(--t-color-green3)',
+    green4: 'var(--t-color-green4)',
+    green5: 'var(--t-color-green5)',
+    green6: 'var(--t-color-green6)',
+    green7: 'var(--t-color-green7)',
+    green8: 'var(--t-color-green8)',
+    green9: 'var(--t-color-green9)',
+    green10: 'var(--t-color-green10)',
+    green11: 'var(--t-color-green11)',
+    green12: 'var(--t-color-green12)',
+    turquoise1: 'var(--t-color-turquoise1)',
+    turquoise2: 'var(--t-color-turquoise2)',
+    turquoise3: 'var(--t-color-turquoise3)',
+    turquoise4: 'var(--t-color-turquoise4)',
+    turquoise5: 'var(--t-color-turquoise5)',
+    turquoise6: 'var(--t-color-turquoise6)',
+    turquoise7: 'var(--t-color-turquoise7)',
+    turquoise8: 'var(--t-color-turquoise8)',
+    turquoise9: 'var(--t-color-turquoise9)',
+    turquoise10: 'var(--t-color-turquoise10)',
+    turquoise11: 'var(--t-color-turquoise11)',
+    turquoise12: 'var(--t-color-turquoise12)',
+    sky1: 'var(--t-color-sky1)',
+    sky2: 'var(--t-color-sky2)',
+    sky3: 'var(--t-color-sky3)',
+    sky4: 'var(--t-color-sky4)',
+    sky5: 'var(--t-color-sky5)',
+    sky6: 'var(--t-color-sky6)',
+    sky7: 'var(--t-color-sky7)',
+    sky8: 'var(--t-color-sky8)',
+    sky9: 'var(--t-color-sky9)',
+    sky10: 'var(--t-color-sky10)',
+    sky11: 'var(--t-color-sky11)',
+    sky12: 'var(--t-color-sky12)',
+    blue1: 'var(--t-color-blue1)',
+    blue2: 'var(--t-color-blue2)',
+    blue3: 'var(--t-color-blue3)',
+    blue4: 'var(--t-color-blue4)',
+    blue5: 'var(--t-color-blue5)',
+    blue6: 'var(--t-color-blue6)',
+    blue7: 'var(--t-color-blue7)',
+    blue8: 'var(--t-color-blue8)',
+    blue9: 'var(--t-color-blue9)',
+    blue10: 'var(--t-color-blue10)',
+    blue11: 'var(--t-color-blue11)',
+    blue12: 'var(--t-color-blue12)',
+    purple1: 'var(--t-color-purple1)',
+    purple2: 'var(--t-color-purple2)',
+    purple3: 'var(--t-color-purple3)',
+    purple4: 'var(--t-color-purple4)',
+    purple5: 'var(--t-color-purple5)',
+    purple6: 'var(--t-color-purple6)',
+    purple7: 'var(--t-color-purple7)',
+    purple8: 'var(--t-color-purple8)',
+    purple9: 'var(--t-color-purple9)',
+    purple10: 'var(--t-color-purple10)',
+    purple11: 'var(--t-color-purple11)',
+    purple12: 'var(--t-color-purple12)',
+    pink1: 'var(--t-color-pink1)',
+    pink2: 'var(--t-color-pink2)',
+    pink3: 'var(--t-color-pink3)',
+    pink4: 'var(--t-color-pink4)',
+    pink5: 'var(--t-color-pink5)',
+    pink6: 'var(--t-color-pink6)',
+    pink7: 'var(--t-color-pink7)',
+    pink8: 'var(--t-color-pink8)',
+    pink9: 'var(--t-color-pink9)',
+    pink10: 'var(--t-color-pink10)',
+    pink11: 'var(--t-color-pink11)',
+    pink12: 'var(--t-color-pink12)',
+    red1: 'var(--t-color-red1)',
+    red2: 'var(--t-color-red2)',
+    red3: 'var(--t-color-red3)',
+    red4: 'var(--t-color-red4)',
+    red5: 'var(--t-color-red5)',
+    red6: 'var(--t-color-red6)',
+    red7: 'var(--t-color-red7)',
+    red8: 'var(--t-color-red8)',
+    red9: 'var(--t-color-red9)',
+    red10: 'var(--t-color-red10)',
+    red11: 'var(--t-color-red11)',
+    red12: 'var(--t-color-red12)',
+    orange1: 'var(--t-color-orange1)',
+    orange2: 'var(--t-color-orange2)',
+    orange3: 'var(--t-color-orange3)',
+    orange4: 'var(--t-color-orange4)',
+    orange5: 'var(--t-color-orange5)',
+    orange6: 'var(--t-color-orange6)',
+    orange7: 'var(--t-color-orange7)',
+    orange8: 'var(--t-color-orange8)',
+    orange9: 'var(--t-color-orange9)',
+    orange10: 'var(--t-color-orange10)',
+    orange11: 'var(--t-color-orange11)',
+    orange12: 'var(--t-color-orange12)',
+    gray1: 'var(--t-color-gray1)',
+    gray2: 'var(--t-color-gray2)',
+    gray3: 'var(--t-color-gray3)',
+    gray4: 'var(--t-color-gray4)',
+    gray5: 'var(--t-color-gray5)',
+    gray6: 'var(--t-color-gray6)',
+    gray7: 'var(--t-color-gray7)',
+    gray8: 'var(--t-color-gray8)',
+    gray9: 'var(--t-color-gray9)',
+    gray10: 'var(--t-color-gray10)',
+    gray11: 'var(--t-color-gray11)',
+    gray12: 'var(--t-color-gray12)',
+    mauve1: 'var(--t-color-mauve1)',
+    mauve2: 'var(--t-color-mauve2)',
+    mauve3: 'var(--t-color-mauve3)',
+    mauve4: 'var(--t-color-mauve4)',
+    mauve5: 'var(--t-color-mauve5)',
+    mauve6: 'var(--t-color-mauve6)',
+    mauve7: 'var(--t-color-mauve7)',
+    mauve8: 'var(--t-color-mauve8)',
+    mauve9: 'var(--t-color-mauve9)',
+    mauve10: 'var(--t-color-mauve10)',
+    mauve11: 'var(--t-color-mauve11)',
+    mauve12: 'var(--t-color-mauve12)',
+    slate1: 'var(--t-color-slate1)',
+    slate2: 'var(--t-color-slate2)',
+    slate3: 'var(--t-color-slate3)',
+    slate4: 'var(--t-color-slate4)',
+    slate5: 'var(--t-color-slate5)',
+    slate6: 'var(--t-color-slate6)',
+    slate7: 'var(--t-color-slate7)',
+    slate8: 'var(--t-color-slate8)',
+    slate9: 'var(--t-color-slate9)',
+    slate10: 'var(--t-color-slate10)',
+    slate11: 'var(--t-color-slate11)',
+    slate12: 'var(--t-color-slate12)',
+    sage1: 'var(--t-color-sage1)',
+    sage2: 'var(--t-color-sage2)',
+    sage3: 'var(--t-color-sage3)',
+    sage4: 'var(--t-color-sage4)',
+    sage5: 'var(--t-color-sage5)',
+    sage6: 'var(--t-color-sage6)',
+    sage7: 'var(--t-color-sage7)',
+    sage8: 'var(--t-color-sage8)',
+    sage9: 'var(--t-color-sage9)',
+    sage10: 'var(--t-color-sage10)',
+    sage11: 'var(--t-color-sage11)',
+    sage12: 'var(--t-color-sage12)',
+    olive1: 'var(--t-color-olive1)',
+    olive2: 'var(--t-color-olive2)',
+    olive3: 'var(--t-color-olive3)',
+    olive4: 'var(--t-color-olive4)',
+    olive5: 'var(--t-color-olive5)',
+    olive6: 'var(--t-color-olive6)',
+    olive7: 'var(--t-color-olive7)',
+    olive8: 'var(--t-color-olive8)',
+    olive9: 'var(--t-color-olive9)',
+    olive10: 'var(--t-color-olive10)',
+    olive11: 'var(--t-color-olive11)',
+    olive12: 'var(--t-color-olive12)',
+    sand1: 'var(--t-color-sand1)',
+    sand2: 'var(--t-color-sand2)',
+    sand3: 'var(--t-color-sand3)',
+    sand4: 'var(--t-color-sand4)',
+    sand5: 'var(--t-color-sand5)',
+    sand6: 'var(--t-color-sand6)',
+    sand7: 'var(--t-color-sand7)',
+    sand8: 'var(--t-color-sand8)',
+    sand9: 'var(--t-color-sand9)',
+    sand10: 'var(--t-color-sand10)',
+    sand11: 'var(--t-color-sand11)',
+    sand12: 'var(--t-color-sand12)',
+    tomato1: 'var(--t-color-tomato1)',
+    tomato2: 'var(--t-color-tomato2)',
+    tomato3: 'var(--t-color-tomato3)',
+    tomato4: 'var(--t-color-tomato4)',
+    tomato5: 'var(--t-color-tomato5)',
+    tomato6: 'var(--t-color-tomato6)',
+    tomato7: 'var(--t-color-tomato7)',
+    tomato8: 'var(--t-color-tomato8)',
+    tomato9: 'var(--t-color-tomato9)',
+    tomato10: 'var(--t-color-tomato10)',
+    tomato11: 'var(--t-color-tomato11)',
+    tomato12: 'var(--t-color-tomato12)',
+    ruby1: 'var(--t-color-ruby1)',
+    ruby2: 'var(--t-color-ruby2)',
+    ruby3: 'var(--t-color-ruby3)',
+    ruby4: 'var(--t-color-ruby4)',
+    ruby5: 'var(--t-color-ruby5)',
+    ruby6: 'var(--t-color-ruby6)',
+    ruby7: 'var(--t-color-ruby7)',
+    ruby8: 'var(--t-color-ruby8)',
+    ruby9: 'var(--t-color-ruby9)',
+    ruby10: 'var(--t-color-ruby10)',
+    ruby11: 'var(--t-color-ruby11)',
+    ruby12: 'var(--t-color-ruby12)',
+    crimson1: 'var(--t-color-crimson1)',
+    crimson2: 'var(--t-color-crimson2)',
+    crimson3: 'var(--t-color-crimson3)',
+    crimson4: 'var(--t-color-crimson4)',
+    crimson5: 'var(--t-color-crimson5)',
+    crimson6: 'var(--t-color-crimson6)',
+    crimson7: 'var(--t-color-crimson7)',
+    crimson8: 'var(--t-color-crimson8)',
+    crimson9: 'var(--t-color-crimson9)',
+    crimson10: 'var(--t-color-crimson10)',
+    crimson11: 'var(--t-color-crimson11)',
+    crimson12: 'var(--t-color-crimson12)',
+    plum1: 'var(--t-color-plum1)',
+    plum2: 'var(--t-color-plum2)',
+    plum3: 'var(--t-color-plum3)',
+    plum4: 'var(--t-color-plum4)',
+    plum5: 'var(--t-color-plum5)',
+    plum6: 'var(--t-color-plum6)',
+    plum7: 'var(--t-color-plum7)',
+    plum8: 'var(--t-color-plum8)',
+    plum9: 'var(--t-color-plum9)',
+    plum10: 'var(--t-color-plum10)',
+    plum11: 'var(--t-color-plum11)',
+    plum12: 'var(--t-color-plum12)',
+    violet1: 'var(--t-color-violet1)',
+    violet2: 'var(--t-color-violet2)',
+    violet3: 'var(--t-color-violet3)',
+    violet4: 'var(--t-color-violet4)',
+    violet5: 'var(--t-color-violet5)',
+    violet6: 'var(--t-color-violet6)',
+    violet7: 'var(--t-color-violet7)',
+    violet8: 'var(--t-color-violet8)',
+    violet9: 'var(--t-color-violet9)',
+    violet10: 'var(--t-color-violet10)',
+    violet11: 'var(--t-color-violet11)',
+    violet12: 'var(--t-color-violet12)',
+    iris1: 'var(--t-color-iris1)',
+    iris2: 'var(--t-color-iris2)',
+    iris3: 'var(--t-color-iris3)',
+    iris4: 'var(--t-color-iris4)',
+    iris5: 'var(--t-color-iris5)',
+    iris6: 'var(--t-color-iris6)',
+    iris7: 'var(--t-color-iris7)',
+    iris8: 'var(--t-color-iris8)',
+    iris9: 'var(--t-color-iris9)',
+    iris10: 'var(--t-color-iris10)',
+    iris11: 'var(--t-color-iris11)',
+    iris12: 'var(--t-color-iris12)',
+    cyan1: 'var(--t-color-cyan1)',
+    cyan2: 'var(--t-color-cyan2)',
+    cyan3: 'var(--t-color-cyan3)',
+    cyan4: 'var(--t-color-cyan4)',
+    cyan5: 'var(--t-color-cyan5)',
+    cyan6: 'var(--t-color-cyan6)',
+    cyan7: 'var(--t-color-cyan7)',
+    cyan8: 'var(--t-color-cyan8)',
+    cyan9: 'var(--t-color-cyan9)',
+    cyan10: 'var(--t-color-cyan10)',
+    cyan11: 'var(--t-color-cyan11)',
+    cyan12: 'var(--t-color-cyan12)',
+    jade1: 'var(--t-color-jade1)',
+    jade2: 'var(--t-color-jade2)',
+    jade3: 'var(--t-color-jade3)',
+    jade4: 'var(--t-color-jade4)',
+    jade5: 'var(--t-color-jade5)',
+    jade6: 'var(--t-color-jade6)',
+    jade7: 'var(--t-color-jade7)',
+    jade8: 'var(--t-color-jade8)',
+    jade9: 'var(--t-color-jade9)',
+    jade10: 'var(--t-color-jade10)',
+    jade11: 'var(--t-color-jade11)',
+    jade12: 'var(--t-color-jade12)',
+    grass1: 'var(--t-color-grass1)',
+    grass2: 'var(--t-color-grass2)',
+    grass3: 'var(--t-color-grass3)',
+    grass4: 'var(--t-color-grass4)',
+    grass5: 'var(--t-color-grass5)',
+    grass6: 'var(--t-color-grass6)',
+    grass7: 'var(--t-color-grass7)',
+    grass8: 'var(--t-color-grass8)',
+    grass9: 'var(--t-color-grass9)',
+    grass10: 'var(--t-color-grass10)',
+    grass11: 'var(--t-color-grass11)',
+    grass12: 'var(--t-color-grass12)',
+    mint1: 'var(--t-color-mint1)',
+    mint2: 'var(--t-color-mint2)',
+    mint3: 'var(--t-color-mint3)',
+    mint4: 'var(--t-color-mint4)',
+    mint5: 'var(--t-color-mint5)',
+    mint6: 'var(--t-color-mint6)',
+    mint7: 'var(--t-color-mint7)',
+    mint8: 'var(--t-color-mint8)',
+    mint9: 'var(--t-color-mint9)',
+    mint10: 'var(--t-color-mint10)',
+    mint11: 'var(--t-color-mint11)',
+    mint12: 'var(--t-color-mint12)',
+    lime1: 'var(--t-color-lime1)',
+    lime2: 'var(--t-color-lime2)',
+    lime3: 'var(--t-color-lime3)',
+    lime4: 'var(--t-color-lime4)',
+    lime5: 'var(--t-color-lime5)',
+    lime6: 'var(--t-color-lime6)',
+    lime7: 'var(--t-color-lime7)',
+    lime8: 'var(--t-color-lime8)',
+    lime9: 'var(--t-color-lime9)',
+    lime10: 'var(--t-color-lime10)',
+    lime11: 'var(--t-color-lime11)',
+    lime12: 'var(--t-color-lime12)',
+    bronze1: 'var(--t-color-bronze1)',
+    bronze2: 'var(--t-color-bronze2)',
+    bronze3: 'var(--t-color-bronze3)',
+    bronze4: 'var(--t-color-bronze4)',
+    bronze5: 'var(--t-color-bronze5)',
+    bronze6: 'var(--t-color-bronze6)',
+    bronze7: 'var(--t-color-bronze7)',
+    bronze8: 'var(--t-color-bronze8)',
+    bronze9: 'var(--t-color-bronze9)',
+    bronze10: 'var(--t-color-bronze10)',
+    bronze11: 'var(--t-color-bronze11)',
+    bronze12: 'var(--t-color-bronze12)',
+    gold1: 'var(--t-color-gold1)',
+    gold2: 'var(--t-color-gold2)',
+    gold3: 'var(--t-color-gold3)',
+    gold4: 'var(--t-color-gold4)',
+    gold5: 'var(--t-color-gold5)',
+    gold6: 'var(--t-color-gold6)',
+    gold7: 'var(--t-color-gold7)',
+    gold8: 'var(--t-color-gold8)',
+    gold9: 'var(--t-color-gold9)',
+    gold10: 'var(--t-color-gold10)',
+    gold11: 'var(--t-color-gold11)',
+    gold12: 'var(--t-color-gold12)',
+    brown1: 'var(--t-color-brown1)',
+    brown2: 'var(--t-color-brown2)',
+    brown3: 'var(--t-color-brown3)',
+    brown4: 'var(--t-color-brown4)',
+    brown5: 'var(--t-color-brown5)',
+    brown6: 'var(--t-color-brown6)',
+    brown7: 'var(--t-color-brown7)',
+    brown8: 'var(--t-color-brown8)',
+    brown9: 'var(--t-color-brown9)',
+    brown10: 'var(--t-color-brown10)',
+    brown11: 'var(--t-color-brown11)',
+    brown12: 'var(--t-color-brown12)',
+    amber1: 'var(--t-color-amber1)',
+    amber2: 'var(--t-color-amber2)',
+    amber3: 'var(--t-color-amber3)',
+    amber4: 'var(--t-color-amber4)',
+    amber5: 'var(--t-color-amber5)',
+    amber6: 'var(--t-color-amber6)',
+    amber7: 'var(--t-color-amber7)',
+    amber8: 'var(--t-color-amber8)',
+    amber9: 'var(--t-color-amber9)',
+    amber10: 'var(--t-color-amber10)',
+    amber11: 'var(--t-color-amber11)',
+    amber12: 'var(--t-color-amber12)',
+    transparent: {
+      green1: 'var(--t-color-transparent-green1)',
+      green2: 'var(--t-color-transparent-green2)',
+      green3: 'var(--t-color-transparent-green3)',
+      green4: 'var(--t-color-transparent-green4)',
+      green5: 'var(--t-color-transparent-green5)',
+      green6: 'var(--t-color-transparent-green6)',
+      green7: 'var(--t-color-transparent-green7)',
+      green8: 'var(--t-color-transparent-green8)',
+      green9: 'var(--t-color-transparent-green9)',
+      green10: 'var(--t-color-transparent-green10)',
+      green11: 'var(--t-color-transparent-green11)',
+      green12: 'var(--t-color-transparent-green12)',
+      turquoise1: 'var(--t-color-transparent-turquoise1)',
+      turquoise2: 'var(--t-color-transparent-turquoise2)',
+      turquoise3: 'var(--t-color-transparent-turquoise3)',
+      turquoise4: 'var(--t-color-transparent-turquoise4)',
+      turquoise5: 'var(--t-color-transparent-turquoise5)',
+      turquoise6: 'var(--t-color-transparent-turquoise6)',
+      turquoise7: 'var(--t-color-transparent-turquoise7)',
+      turquoise8: 'var(--t-color-transparent-turquoise8)',
+      turquoise9: 'var(--t-color-transparent-turquoise9)',
+      turquoise10: 'var(--t-color-transparent-turquoise10)',
+      turquoise11: 'var(--t-color-transparent-turquoise11)',
+      turquoise12: 'var(--t-color-transparent-turquoise12)',
+      sky1: 'var(--t-color-transparent-sky1)',
+      sky2: 'var(--t-color-transparent-sky2)',
+      sky3: 'var(--t-color-transparent-sky3)',
+      sky4: 'var(--t-color-transparent-sky4)',
+      sky5: 'var(--t-color-transparent-sky5)',
+      sky6: 'var(--t-color-transparent-sky6)',
+      sky7: 'var(--t-color-transparent-sky7)',
+      sky8: 'var(--t-color-transparent-sky8)',
+      sky9: 'var(--t-color-transparent-sky9)',
+      sky10: 'var(--t-color-transparent-sky10)',
+      sky11: 'var(--t-color-transparent-sky11)',
+      sky12: 'var(--t-color-transparent-sky12)',
+      blue1: 'var(--t-color-transparent-blue1)',
+      blue2: 'var(--t-color-transparent-blue2)',
+      blue3: 'var(--t-color-transparent-blue3)',
+      blue4: 'var(--t-color-transparent-blue4)',
+      blue5: 'var(--t-color-transparent-blue5)',
+      blue6: 'var(--t-color-transparent-blue6)',
+      blue7: 'var(--t-color-transparent-blue7)',
+      blue8: 'var(--t-color-transparent-blue8)',
+      blue9: 'var(--t-color-transparent-blue9)',
+      blue10: 'var(--t-color-transparent-blue10)',
+      blue11: 'var(--t-color-transparent-blue11)',
+      blue12: 'var(--t-color-transparent-blue12)',
+      purple1: 'var(--t-color-transparent-purple1)',
+      purple2: 'var(--t-color-transparent-purple2)',
+      purple3: 'var(--t-color-transparent-purple3)',
+      purple4: 'var(--t-color-transparent-purple4)',
+      purple5: 'var(--t-color-transparent-purple5)',
+      purple6: 'var(--t-color-transparent-purple6)',
+      purple7: 'var(--t-color-transparent-purple7)',
+      purple8: 'var(--t-color-transparent-purple8)',
+      purple9: 'var(--t-color-transparent-purple9)',
+      purple10: 'var(--t-color-transparent-purple10)',
+      purple11: 'var(--t-color-transparent-purple11)',
+      purple12: 'var(--t-color-transparent-purple12)',
+      pink1: 'var(--t-color-transparent-pink1)',
+      pink2: 'var(--t-color-transparent-pink2)',
+      pink3: 'var(--t-color-transparent-pink3)',
+      pink4: 'var(--t-color-transparent-pink4)',
+      pink5: 'var(--t-color-transparent-pink5)',
+      pink6: 'var(--t-color-transparent-pink6)',
+      pink7: 'var(--t-color-transparent-pink7)',
+      pink8: 'var(--t-color-transparent-pink8)',
+      pink9: 'var(--t-color-transparent-pink9)',
+      pink10: 'var(--t-color-transparent-pink10)',
+      pink11: 'var(--t-color-transparent-pink11)',
+      pink12: 'var(--t-color-transparent-pink12)',
+      red1: 'var(--t-color-transparent-red1)',
+      red2: 'var(--t-color-transparent-red2)',
+      red3: 'var(--t-color-transparent-red3)',
+      red4: 'var(--t-color-transparent-red4)',
+      red5: 'var(--t-color-transparent-red5)',
+      red6: 'var(--t-color-transparent-red6)',
+      red7: 'var(--t-color-transparent-red7)',
+      red8: 'var(--t-color-transparent-red8)',
+      red9: 'var(--t-color-transparent-red9)',
+      red10: 'var(--t-color-transparent-red10)',
+      red11: 'var(--t-color-transparent-red11)',
+      red12: 'var(--t-color-transparent-red12)',
+      orange1: 'var(--t-color-transparent-orange1)',
+      orange2: 'var(--t-color-transparent-orange2)',
+      orange3: 'var(--t-color-transparent-orange3)',
+      orange4: 'var(--t-color-transparent-orange4)',
+      orange5: 'var(--t-color-transparent-orange5)',
+      orange6: 'var(--t-color-transparent-orange6)',
+      orange7: 'var(--t-color-transparent-orange7)',
+      orange8: 'var(--t-color-transparent-orange8)',
+      orange9: 'var(--t-color-transparent-orange9)',
+      orange10: 'var(--t-color-transparent-orange10)',
+      orange11: 'var(--t-color-transparent-orange11)',
+      orange12: 'var(--t-color-transparent-orange12)',
+      yellow1: 'var(--t-color-transparent-yellow1)',
+      yellow2: 'var(--t-color-transparent-yellow2)',
+      yellow3: 'var(--t-color-transparent-yellow3)',
+      yellow4: 'var(--t-color-transparent-yellow4)',
+      yellow5: 'var(--t-color-transparent-yellow5)',
+      yellow6: 'var(--t-color-transparent-yellow6)',
+      yellow7: 'var(--t-color-transparent-yellow7)',
+      yellow8: 'var(--t-color-transparent-yellow8)',
+      yellow9: 'var(--t-color-transparent-yellow9)',
+      yellow10: 'var(--t-color-transparent-yellow10)',
+      yellow11: 'var(--t-color-transparent-yellow11)',
+      yellow12: 'var(--t-color-transparent-yellow12)',
+      gray1: 'var(--t-color-transparent-gray1)',
+      gray2: 'var(--t-color-transparent-gray2)',
+      gray3: 'var(--t-color-transparent-gray3)',
+      gray4: 'var(--t-color-transparent-gray4)',
+      gray5: 'var(--t-color-transparent-gray5)',
+      gray6: 'var(--t-color-transparent-gray6)',
+      gray7: 'var(--t-color-transparent-gray7)',
+      gray8: 'var(--t-color-transparent-gray8)',
+      gray9: 'var(--t-color-transparent-gray9)',
+      gray10: 'var(--t-color-transparent-gray10)',
+      gray11: 'var(--t-color-transparent-gray11)',
+      gray12: 'var(--t-color-transparent-gray12)',
+      mauve1: 'var(--t-color-transparent-mauve1)',
+      mauve2: 'var(--t-color-transparent-mauve2)',
+      mauve3: 'var(--t-color-transparent-mauve3)',
+      mauve4: 'var(--t-color-transparent-mauve4)',
+      mauve5: 'var(--t-color-transparent-mauve5)',
+      mauve6: 'var(--t-color-transparent-mauve6)',
+      mauve7: 'var(--t-color-transparent-mauve7)',
+      mauve8: 'var(--t-color-transparent-mauve8)',
+      mauve9: 'var(--t-color-transparent-mauve9)',
+      mauve10: 'var(--t-color-transparent-mauve10)',
+      mauve11: 'var(--t-color-transparent-mauve11)',
+      mauve12: 'var(--t-color-transparent-mauve12)',
+      slate1: 'var(--t-color-transparent-slate1)',
+      slate2: 'var(--t-color-transparent-slate2)',
+      slate3: 'var(--t-color-transparent-slate3)',
+      slate4: 'var(--t-color-transparent-slate4)',
+      slate5: 'var(--t-color-transparent-slate5)',
+      slate6: 'var(--t-color-transparent-slate6)',
+      slate7: 'var(--t-color-transparent-slate7)',
+      slate8: 'var(--t-color-transparent-slate8)',
+      slate9: 'var(--t-color-transparent-slate9)',
+      slate10: 'var(--t-color-transparent-slate10)',
+      slate11: 'var(--t-color-transparent-slate11)',
+      slate12: 'var(--t-color-transparent-slate12)',
+      sage1: 'var(--t-color-transparent-sage1)',
+      sage2: 'var(--t-color-transparent-sage2)',
+      sage3: 'var(--t-color-transparent-sage3)',
+      sage4: 'var(--t-color-transparent-sage4)',
+      sage5: 'var(--t-color-transparent-sage5)',
+      sage6: 'var(--t-color-transparent-sage6)',
+      sage7: 'var(--t-color-transparent-sage7)',
+      sage8: 'var(--t-color-transparent-sage8)',
+      sage9: 'var(--t-color-transparent-sage9)',
+      sage10: 'var(--t-color-transparent-sage10)',
+      sage11: 'var(--t-color-transparent-sage11)',
+      sage12: 'var(--t-color-transparent-sage12)',
+      olive1: 'var(--t-color-transparent-olive1)',
+      olive2: 'var(--t-color-transparent-olive2)',
+      olive3: 'var(--t-color-transparent-olive3)',
+      olive4: 'var(--t-color-transparent-olive4)',
+      olive5: 'var(--t-color-transparent-olive5)',
+      olive6: 'var(--t-color-transparent-olive6)',
+      olive7: 'var(--t-color-transparent-olive7)',
+      olive8: 'var(--t-color-transparent-olive8)',
+      olive9: 'var(--t-color-transparent-olive9)',
+      olive10: 'var(--t-color-transparent-olive10)',
+      olive11: 'var(--t-color-transparent-olive11)',
+      olive12: 'var(--t-color-transparent-olive12)',
+      sand1: 'var(--t-color-transparent-sand1)',
+      sand2: 'var(--t-color-transparent-sand2)',
+      sand3: 'var(--t-color-transparent-sand3)',
+      sand4: 'var(--t-color-transparent-sand4)',
+      sand5: 'var(--t-color-transparent-sand5)',
+      sand6: 'var(--t-color-transparent-sand6)',
+      sand7: 'var(--t-color-transparent-sand7)',
+      sand8: 'var(--t-color-transparent-sand8)',
+      sand9: 'var(--t-color-transparent-sand9)',
+      sand10: 'var(--t-color-transparent-sand10)',
+      sand11: 'var(--t-color-transparent-sand11)',
+      sand12: 'var(--t-color-transparent-sand12)',
+      tomato1: 'var(--t-color-transparent-tomato1)',
+      tomato2: 'var(--t-color-transparent-tomato2)',
+      tomato3: 'var(--t-color-transparent-tomato3)',
+      tomato4: 'var(--t-color-transparent-tomato4)',
+      tomato5: 'var(--t-color-transparent-tomato5)',
+      tomato6: 'var(--t-color-transparent-tomato6)',
+      tomato7: 'var(--t-color-transparent-tomato7)',
+      tomato8: 'var(--t-color-transparent-tomato8)',
+      tomato9: 'var(--t-color-transparent-tomato9)',
+      tomato10: 'var(--t-color-transparent-tomato10)',
+      tomato11: 'var(--t-color-transparent-tomato11)',
+      tomato12: 'var(--t-color-transparent-tomato12)',
+      ruby1: 'var(--t-color-transparent-ruby1)',
+      ruby2: 'var(--t-color-transparent-ruby2)',
+      ruby3: 'var(--t-color-transparent-ruby3)',
+      ruby4: 'var(--t-color-transparent-ruby4)',
+      ruby5: 'var(--t-color-transparent-ruby5)',
+      ruby6: 'var(--t-color-transparent-ruby6)',
+      ruby7: 'var(--t-color-transparent-ruby7)',
+      ruby8: 'var(--t-color-transparent-ruby8)',
+      ruby9: 'var(--t-color-transparent-ruby9)',
+      ruby10: 'var(--t-color-transparent-ruby10)',
+      ruby11: 'var(--t-color-transparent-ruby11)',
+      ruby12: 'var(--t-color-transparent-ruby12)',
+      crimson1: 'var(--t-color-transparent-crimson1)',
+      crimson2: 'var(--t-color-transparent-crimson2)',
+      crimson3: 'var(--t-color-transparent-crimson3)',
+      crimson4: 'var(--t-color-transparent-crimson4)',
+      crimson5: 'var(--t-color-transparent-crimson5)',
+      crimson6: 'var(--t-color-transparent-crimson6)',
+      crimson7: 'var(--t-color-transparent-crimson7)',
+      crimson8: 'var(--t-color-transparent-crimson8)',
+      crimson9: 'var(--t-color-transparent-crimson9)',
+      crimson10: 'var(--t-color-transparent-crimson10)',
+      crimson11: 'var(--t-color-transparent-crimson11)',
+      crimson12: 'var(--t-color-transparent-crimson12)',
+      plum1: 'var(--t-color-transparent-plum1)',
+      plum2: 'var(--t-color-transparent-plum2)',
+      plum3: 'var(--t-color-transparent-plum3)',
+      plum4: 'var(--t-color-transparent-plum4)',
+      plum5: 'var(--t-color-transparent-plum5)',
+      plum6: 'var(--t-color-transparent-plum6)',
+      plum7: 'var(--t-color-transparent-plum7)',
+      plum8: 'var(--t-color-transparent-plum8)',
+      plum9: 'var(--t-color-transparent-plum9)',
+      plum10: 'var(--t-color-transparent-plum10)',
+      plum11: 'var(--t-color-transparent-plum11)',
+      plum12: 'var(--t-color-transparent-plum12)',
+      violet1: 'var(--t-color-transparent-violet1)',
+      violet2: 'var(--t-color-transparent-violet2)',
+      violet3: 'var(--t-color-transparent-violet3)',
+      violet4: 'var(--t-color-transparent-violet4)',
+      violet5: 'var(--t-color-transparent-violet5)',
+      violet6: 'var(--t-color-transparent-violet6)',
+      violet7: 'var(--t-color-transparent-violet7)',
+      violet8: 'var(--t-color-transparent-violet8)',
+      violet9: 'var(--t-color-transparent-violet9)',
+      violet10: 'var(--t-color-transparent-violet10)',
+      violet11: 'var(--t-color-transparent-violet11)',
+      violet12: 'var(--t-color-transparent-violet12)',
+      iris1: 'var(--t-color-transparent-iris1)',
+      iris2: 'var(--t-color-transparent-iris2)',
+      iris3: 'var(--t-color-transparent-iris3)',
+      iris4: 'var(--t-color-transparent-iris4)',
+      iris5: 'var(--t-color-transparent-iris5)',
+      iris6: 'var(--t-color-transparent-iris6)',
+      iris7: 'var(--t-color-transparent-iris7)',
+      iris8: 'var(--t-color-transparent-iris8)',
+      iris9: 'var(--t-color-transparent-iris9)',
+      iris10: 'var(--t-color-transparent-iris10)',
+      iris11: 'var(--t-color-transparent-iris11)',
+      iris12: 'var(--t-color-transparent-iris12)',
+      cyan1: 'var(--t-color-transparent-cyan1)',
+      cyan2: 'var(--t-color-transparent-cyan2)',
+      cyan3: 'var(--t-color-transparent-cyan3)',
+      cyan4: 'var(--t-color-transparent-cyan4)',
+      cyan5: 'var(--t-color-transparent-cyan5)',
+      cyan6: 'var(--t-color-transparent-cyan6)',
+      cyan7: 'var(--t-color-transparent-cyan7)',
+      cyan8: 'var(--t-color-transparent-cyan8)',
+      cyan9: 'var(--t-color-transparent-cyan9)',
+      cyan10: 'var(--t-color-transparent-cyan10)',
+      cyan11: 'var(--t-color-transparent-cyan11)',
+      cyan12: 'var(--t-color-transparent-cyan12)',
+      jade1: 'var(--t-color-transparent-jade1)',
+      jade2: 'var(--t-color-transparent-jade2)',
+      jade3: 'var(--t-color-transparent-jade3)',
+      jade4: 'var(--t-color-transparent-jade4)',
+      jade5: 'var(--t-color-transparent-jade5)',
+      jade6: 'var(--t-color-transparent-jade6)',
+      jade7: 'var(--t-color-transparent-jade7)',
+      jade8: 'var(--t-color-transparent-jade8)',
+      jade9: 'var(--t-color-transparent-jade9)',
+      jade10: 'var(--t-color-transparent-jade10)',
+      jade11: 'var(--t-color-transparent-jade11)',
+      jade12: 'var(--t-color-transparent-jade12)',
+      grass1: 'var(--t-color-transparent-grass1)',
+      grass2: 'var(--t-color-transparent-grass2)',
+      grass3: 'var(--t-color-transparent-grass3)',
+      grass4: 'var(--t-color-transparent-grass4)',
+      grass5: 'var(--t-color-transparent-grass5)',
+      grass6: 'var(--t-color-transparent-grass6)',
+      grass7: 'var(--t-color-transparent-grass7)',
+      grass8: 'var(--t-color-transparent-grass8)',
+      grass9: 'var(--t-color-transparent-grass9)',
+      grass10: 'var(--t-color-transparent-grass10)',
+      grass11: 'var(--t-color-transparent-grass11)',
+      grass12: 'var(--t-color-transparent-grass12)',
+      mint1: 'var(--t-color-transparent-mint1)',
+      mint2: 'var(--t-color-transparent-mint2)',
+      mint3: 'var(--t-color-transparent-mint3)',
+      mint4: 'var(--t-color-transparent-mint4)',
+      mint5: 'var(--t-color-transparent-mint5)',
+      mint6: 'var(--t-color-transparent-mint6)',
+      mint7: 'var(--t-color-transparent-mint7)',
+      mint8: 'var(--t-color-transparent-mint8)',
+      mint9: 'var(--t-color-transparent-mint9)',
+      mint10: 'var(--t-color-transparent-mint10)',
+      mint11: 'var(--t-color-transparent-mint11)',
+      mint12: 'var(--t-color-transparent-mint12)',
+      lime1: 'var(--t-color-transparent-lime1)',
+      lime2: 'var(--t-color-transparent-lime2)',
+      lime3: 'var(--t-color-transparent-lime3)',
+      lime4: 'var(--t-color-transparent-lime4)',
+      lime5: 'var(--t-color-transparent-lime5)',
+      lime6: 'var(--t-color-transparent-lime6)',
+      lime7: 'var(--t-color-transparent-lime7)',
+      lime8: 'var(--t-color-transparent-lime8)',
+      lime9: 'var(--t-color-transparent-lime9)',
+      lime10: 'var(--t-color-transparent-lime10)',
+      lime11: 'var(--t-color-transparent-lime11)',
+      lime12: 'var(--t-color-transparent-lime12)',
+      bronze1: 'var(--t-color-transparent-bronze1)',
+      bronze2: 'var(--t-color-transparent-bronze2)',
+      bronze3: 'var(--t-color-transparent-bronze3)',
+      bronze4: 'var(--t-color-transparent-bronze4)',
+      bronze5: 'var(--t-color-transparent-bronze5)',
+      bronze6: 'var(--t-color-transparent-bronze6)',
+      bronze7: 'var(--t-color-transparent-bronze7)',
+      bronze8: 'var(--t-color-transparent-bronze8)',
+      bronze9: 'var(--t-color-transparent-bronze9)',
+      bronze10: 'var(--t-color-transparent-bronze10)',
+      bronze11: 'var(--t-color-transparent-bronze11)',
+      bronze12: 'var(--t-color-transparent-bronze12)',
+      gold1: 'var(--t-color-transparent-gold1)',
+      gold2: 'var(--t-color-transparent-gold2)',
+      gold3: 'var(--t-color-transparent-gold3)',
+      gold4: 'var(--t-color-transparent-gold4)',
+      gold5: 'var(--t-color-transparent-gold5)',
+      gold6: 'var(--t-color-transparent-gold6)',
+      gold7: 'var(--t-color-transparent-gold7)',
+      gold8: 'var(--t-color-transparent-gold8)',
+      gold9: 'var(--t-color-transparent-gold9)',
+      gold10: 'var(--t-color-transparent-gold10)',
+      gold11: 'var(--t-color-transparent-gold11)',
+      gold12: 'var(--t-color-transparent-gold12)',
+      brown1: 'var(--t-color-transparent-brown1)',
+      brown2: 'var(--t-color-transparent-brown2)',
+      brown3: 'var(--t-color-transparent-brown3)',
+      brown4: 'var(--t-color-transparent-brown4)',
+      brown5: 'var(--t-color-transparent-brown5)',
+      brown6: 'var(--t-color-transparent-brown6)',
+      brown7: 'var(--t-color-transparent-brown7)',
+      brown8: 'var(--t-color-transparent-brown8)',
+      brown9: 'var(--t-color-transparent-brown9)',
+      brown10: 'var(--t-color-transparent-brown10)',
+      brown11: 'var(--t-color-transparent-brown11)',
+      brown12: 'var(--t-color-transparent-brown12)',
+      amber1: 'var(--t-color-transparent-amber1)',
+      amber2: 'var(--t-color-transparent-amber2)',
+      amber3: 'var(--t-color-transparent-amber3)',
+      amber4: 'var(--t-color-transparent-amber4)',
+      amber5: 'var(--t-color-transparent-amber5)',
+      amber6: 'var(--t-color-transparent-amber6)',
+      amber7: 'var(--t-color-transparent-amber7)',
+      amber8: 'var(--t-color-transparent-amber8)',
+      amber9: 'var(--t-color-transparent-amber9)',
+      amber10: 'var(--t-color-transparent-amber10)',
+      amber11: 'var(--t-color-transparent-amber11)',
+      amber12: 'var(--t-color-transparent-amber12)',
+    },
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/AccentDark.ts b/packages/twenty-new-ui/src/theme/constants/AccentDark.ts
new file mode 100644
index 00000000000..c95cd81d314
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/AccentDark.ts
@@ -0,0 +1,23 @@
+import * as RadixColors from '@radix-ui/colors';
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+
+export const ACCENT_DARK = {
+  primary: COLOR_DARK.blue5,
+  secondary: COLOR_DARK.blue5,
+  tertiary: COLOR_DARK.blue3,
+  quaternary: COLOR_DARK.blue2,
+  accent3570: COLOR_DARK.blue8,
+  accent4060: COLOR_DARK.blue8,
+  accent1: RadixColors.indigoDarkP3.indigo1,
+  accent2: RadixColors.indigoDarkP3.indigo2,
+  accent3: RadixColors.indigoDarkP3.indigo3,
+  accent4: RadixColors.indigoDarkP3.indigo4,
+  accent5: RadixColors.indigoDarkP3.indigo5,
+  accent6: RadixColors.indigoDarkP3.indigo6,
+  accent7: RadixColors.indigoDarkP3.indigo7,
+  accent8: RadixColors.indigoDarkP3.indigo8,
+  accent9: RadixColors.indigoDarkP3.indigo9,
+  accent10: RadixColors.indigoDarkP3.indigo10,
+  accent11: RadixColors.indigoDarkP3.indigo11,
+  accent12: RadixColors.indigoDarkP3.indigo12,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/AccentLight.ts b/packages/twenty-new-ui/src/theme/constants/AccentLight.ts
new file mode 100644
index 00000000000..f8e6c7cf3c1
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/AccentLight.ts
@@ -0,0 +1,23 @@
+import * as RadixColors from '@radix-ui/colors';
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+
+export const ACCENT_LIGHT = {
+  primary: COLOR_LIGHT.blue5,
+  secondary: COLOR_LIGHT.blue5,
+  tertiary: COLOR_LIGHT.blue3,
+  quaternary: COLOR_LIGHT.blue2,
+  accent3570: COLOR_LIGHT.blue8,
+  accent4060: COLOR_LIGHT.blue8,
+  accent1: RadixColors.indigoP3.indigo1,
+  accent2: RadixColors.indigoP3.indigo2,
+  accent3: RadixColors.indigoP3.indigo3,
+  accent4: RadixColors.indigoP3.indigo4,
+  accent5: RadixColors.indigoP3.indigo5,
+  accent6: RadixColors.indigoP3.indigo6,
+  accent7: RadixColors.indigoP3.indigo7,
+  accent8: RadixColors.indigoP3.indigo8,
+  accent9: RadixColors.indigoP3.indigo9,
+  accent10: RadixColors.indigoP3.indigo10,
+  accent11: RadixColors.indigoP3.indigo11,
+  accent12: RadixColors.indigoP3.indigo12,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/Animation.ts b/packages/twenty-new-ui/src/theme/constants/Animation.ts
new file mode 100644
index 00000000000..4e2c2c3340f
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/Animation.ts
@@ -0,0 +1,10 @@
+export const ANIMATION = {
+  duration: {
+    instant: 0.075,
+    fast: 0.15,
+    normal: 0.3,
+    slow: 1.5,
+  },
+};
+
+export type AnimationDuration = keyof typeof ANIMATION.duration;
diff --git a/packages/twenty-new-ui/src/theme/constants/BackgroundDark.ts b/packages/twenty-new-ui/src/theme/constants/BackgroundDark.ts
new file mode 100644
index 00000000000..e3d7420b6b2
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BackgroundDark.ts
@@ -0,0 +1,35 @@
+import * as RadixColors from '@radix-ui/colors';
+
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+import { GRAY_SCALE_DARK } from './GrayScaleDark';
+import { TRANSPARENT_COLORS_DARK } from './TransparentColorsDark';
+
+export const BACKGROUND_DARK = {
+  noisy: 'var(--t-background-noisy)',
+  primary: GRAY_SCALE_DARK.gray1,
+  secondary: GRAY_SCALE_DARK.gray2,
+  tertiary: GRAY_SCALE_DARK.gray4,
+  quaternary: GRAY_SCALE_DARK.gray5,
+  invertedPrimary: GRAY_SCALE_DARK.gray12,
+  invertedSecondary: GRAY_SCALE_DARK.gray11,
+  danger: COLOR_DARK.red3,
+  transparent: {
+    primary: RadixColors.blackP3A.blackA7,
+    secondary: RadixColors.blackP3A.blackA6,
+    strong: TRANSPARENT_COLORS_DARK.gray7,
+    medium: TRANSPARENT_COLORS_DARK.gray5,
+    light: TRANSPARENT_COLORS_DARK.gray2,
+    lighter: TRANSPARENT_COLORS_DARK.gray1,
+    danger: TRANSPARENT_COLORS_DARK.red3,
+    blue: TRANSPARENT_COLORS_DARK.blue4,
+    orange: TRANSPARENT_COLORS_DARK.orange4,
+    success: TRANSPARENT_COLORS_DARK.green4,
+  },
+  overlayPrimary: '#000000b8',
+  overlaySecondary: '#0000005c',
+  overlayTertiary: '#0000005c',
+  radialGradient: `radial-gradient(50% 62.62% at 50% 0%, ${GRAY_SCALE_DARK.gray9} 0%, ${GRAY_SCALE_DARK.gray10} 100%)`,
+  radialGradientHover: `radial-gradient(76.32% 95.59% at 50% 0%, ${GRAY_SCALE_DARK.gray10} 0%, ${GRAY_SCALE_DARK.gray11} 100%)`,
+  primaryInverted: GRAY_SCALE_DARK.gray12,
+  primaryInvertedHover: GRAY_SCALE_DARK.gray11,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BackgroundLight.ts b/packages/twenty-new-ui/src/theme/constants/BackgroundLight.ts
new file mode 100644
index 00000000000..4ba0183af24
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BackgroundLight.ts
@@ -0,0 +1,35 @@
+import * as RadixColors from '@radix-ui/colors';
+
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
+import { TRANSPARENT_COLORS_LIGHT } from './TransparentColorsLight';
+
+export const BACKGROUND_LIGHT = {
+  noisy: 'var(--t-background-noisy)',
+  primary: GRAY_SCALE_LIGHT.gray1,
+  secondary: GRAY_SCALE_LIGHT.gray2,
+  tertiary: GRAY_SCALE_LIGHT.gray4,
+  quaternary: GRAY_SCALE_LIGHT.gray5,
+  invertedPrimary: GRAY_SCALE_LIGHT.gray12,
+  invertedSecondary: GRAY_SCALE_LIGHT.gray11,
+  danger: COLOR_LIGHT.red3,
+  transparent: {
+    primary: RadixColors.whiteP3A.whiteA7,
+    secondary: RadixColors.whiteP3A.whiteA6,
+    strong: TRANSPARENT_COLORS_LIGHT.gray7,
+    medium: TRANSPARENT_COLORS_LIGHT.gray5,
+    light: TRANSPARENT_COLORS_LIGHT.gray2,
+    lighter: TRANSPARENT_COLORS_LIGHT.gray1,
+    danger: TRANSPARENT_COLORS_LIGHT.red3,
+    blue: TRANSPARENT_COLORS_LIGHT.blue3,
+    orange: TRANSPARENT_COLORS_LIGHT.orange3,
+    success: TRANSPARENT_COLORS_LIGHT.green3,
+  },
+  overlayPrimary: TRANSPARENT_COLORS_LIGHT.gray11,
+  overlaySecondary: TRANSPARENT_COLORS_LIGHT.gray9,
+  overlayTertiary: TRANSPARENT_COLORS_LIGHT.gray4,
+  radialGradient: `radial-gradient(50% 62.62% at 50% 0%, ${GRAY_SCALE_LIGHT.gray9} 0%, ${GRAY_SCALE_LIGHT.gray10} 100%)`,
+  radialGradientHover: `radial-gradient(76.32% 95.59% at 50% 0%, ${GRAY_SCALE_LIGHT.gray10} 0%, ${GRAY_SCALE_LIGHT.gray11} 100%)`,
+  primaryInverted: GRAY_SCALE_LIGHT.gray12,
+  primaryInvertedHover: GRAY_SCALE_LIGHT.gray11,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BlurDark.ts b/packages/twenty-new-ui/src/theme/constants/BlurDark.ts
new file mode 100644
index 00000000000..84129053f09
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BlurDark.ts
@@ -0,0 +1,5 @@
+export const BLUR_DARK = {
+  light: 'blur(6px) saturate(200%) contrast(100%) brightness(130%)',
+  medium: 'blur(12px) saturate(200%) contrast(100%) brightness(130%)',
+  strong: 'blur(20px) saturate(200%) contrast(100%) brightness(130%)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BlurLight.ts b/packages/twenty-new-ui/src/theme/constants/BlurLight.ts
new file mode 100644
index 00000000000..4661f2f3956
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BlurLight.ts
@@ -0,0 +1,5 @@
+export const BLUR_LIGHT = {
+  light: 'blur(6px) saturate(200%) contrast(50%) brightness(130%)',
+  medium: 'blur(12px) saturate(200%) contrast(50%) brightness(130%)',
+  strong: 'blur(20px) saturate(200%) contrast(50%) brightness(130%)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BorderCommon.ts b/packages/twenty-new-ui/src/theme/constants/BorderCommon.ts
new file mode 100644
index 00000000000..b9412445087
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BorderCommon.ts
@@ -0,0 +1,11 @@
+export const BORDER_COMMON = {
+  radius: {
+    xs: '2px',
+    sm: '4px',
+    md: '8px',
+    xl: '20px',
+    xxl: '40px',
+    pill: '999px',
+    rounded: '100%',
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BorderDark.ts b/packages/twenty-new-ui/src/theme/constants/BorderDark.ts
new file mode 100644
index 00000000000..4105fe4407a
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BorderDark.ts
@@ -0,0 +1,18 @@
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+import { BORDER_COMMON } from './BorderCommon';
+import { GRAY_SCALE_DARK } from './GrayScaleDark';
+import { TRANSPARENT_COLORS_DARK } from './TransparentColorsDark';
+
+export const BORDER_DARK = {
+  color: {
+    strong: GRAY_SCALE_DARK.gray6,
+    medium: GRAY_SCALE_DARK.gray5,
+    light: GRAY_SCALE_DARK.gray4,
+    secondaryInverted: GRAY_SCALE_DARK.gray11,
+    inverted: GRAY_SCALE_DARK.gray12,
+    danger: COLOR_DARK.red5,
+    blue: COLOR_DARK.blue7,
+    transparentStrong: TRANSPARENT_COLORS_DARK.gray4,
+  },
+  ...BORDER_COMMON,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BorderLight.ts b/packages/twenty-new-ui/src/theme/constants/BorderLight.ts
new file mode 100644
index 00000000000..9470a406640
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BorderLight.ts
@@ -0,0 +1,18 @@
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+import { BORDER_COMMON } from './BorderCommon';
+import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
+import { TRANSPARENT_COLORS_LIGHT } from './TransparentColorsLight';
+
+export const BORDER_LIGHT = {
+  color: {
+    strong: GRAY_SCALE_LIGHT.gray6,
+    medium: GRAY_SCALE_LIGHT.gray5,
+    light: GRAY_SCALE_LIGHT.gray4,
+    secondaryInverted: GRAY_SCALE_LIGHT.gray11,
+    inverted: GRAY_SCALE_LIGHT.gray12,
+    danger: COLOR_LIGHT.red5,
+    blue: COLOR_LIGHT.blue7,
+    transparentStrong: TRANSPARENT_COLORS_LIGHT.gray4,
+  },
+  ...BORDER_COMMON,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BoxShadowDark.ts b/packages/twenty-new-ui/src/theme/constants/BoxShadowDark.ts
new file mode 100644
index 00000000000..aad5ca2719f
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BoxShadowDark.ts
@@ -0,0 +1,19 @@
+import { RGBA } from '@new-ui/theme/constants/Rgba';
+
+/* oxlint-disable twenty/no-hardcoded-colors */
+export const BOX_SHADOW_DARK = {
+  color: RGBA('#000000', 0.6),
+  light: `0px 2px 4px 0px ${RGBA(
+    '#000000',
+    0.04,
+  )}, 0px 0px 4px 0px ${RGBA('#000000', 0.08)}`,
+  strong: `2px 4px 16px 0px ${RGBA(
+    '#000000',
+    0.16,
+  )}, 0px 2px 4px 0px ${RGBA('#000000', 0.08)}`,
+  underline: `0px 1px 0px 0px ${RGBA('#000000', 0.32)}`,
+  superHeavy: `2px 4px 16px 0px ${RGBA(
+    '#000000',
+    0.12,
+  )}, 0px 2px 4px 0px ${RGBA('#000000', 0.04)}`,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/BoxShadowLight.ts b/packages/twenty-new-ui/src/theme/constants/BoxShadowLight.ts
new file mode 100644
index 00000000000..5ac33ae3031
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/BoxShadowLight.ts
@@ -0,0 +1,9 @@
+import { GRAY_SCALE_LIGHT_ALPHA } from '@new-ui/theme/constants/GrayScaleLightAlpha';
+
+export const BOX_SHADOW_LIGHT = {
+  color: GRAY_SCALE_LIGHT_ALPHA.gray2,
+  light: `0px 2px 4px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray2}, 0px 0px 4px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray5}`,
+  strong: `2px 4px 16px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray7}, 0px 2px 4px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray5}`,
+  underline: `0px 1px 0px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray9}`,
+  superHeavy: `0px 0px 8px 0px ${GRAY_SCALE_LIGHT_ALPHA.gray7}, 0px 8px 64px -16px ${GRAY_SCALE_LIGHT_ALPHA.gray10}, 0px 24px 56px -16px ${GRAY_SCALE_LIGHT_ALPHA.gray5}`,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/CodeDark.ts b/packages/twenty-new-ui/src/theme/constants/CodeDark.ts
new file mode 100644
index 00000000000..afda65c33ca
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/CodeDark.ts
@@ -0,0 +1,12 @@
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+
+export const CODE_DARK = {
+  text: {
+    gray: COLOR_DARK.gray10,
+    sky: COLOR_DARK.sky10,
+    pink: COLOR_DARK.pink10,
+    orange: COLOR_DARK.orange8,
+    green: COLOR_DARK.lime8,
+  },
+  font: { family: 'DM Mono' },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/CodeLight.ts b/packages/twenty-new-ui/src/theme/constants/CodeLight.ts
new file mode 100644
index 00000000000..116d7ef87ff
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/CodeLight.ts
@@ -0,0 +1,12 @@
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+
+export const CODE_LIGHT = {
+  text: {
+    gray: COLOR_LIGHT.gray10,
+    sky: COLOR_LIGHT.sky10,
+    pink: COLOR_LIGHT.pink10,
+    orange: COLOR_LIGHT.orange8,
+    green: COLOR_LIGHT.lime8,
+  },
+  font: { family: 'DM Mono' },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/ColorsDark.ts b/packages/twenty-new-ui/src/theme/constants/ColorsDark.ts
new file mode 100644
index 00000000000..dffa3b08e39
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/ColorsDark.ts
@@ -0,0 +1,9 @@
+import { MAIN_COLORS_DARK } from './MainColorsDark';
+import { SECONDARY_COLORS_DARK } from './SecondaryColorsDark';
+import { TRANSPARENT_COLORS_DARK } from './TransparentColorsDark';
+
+export const COLOR_DARK = {
+  ...MAIN_COLORS_DARK,
+  ...SECONDARY_COLORS_DARK,
+  transparent: TRANSPARENT_COLORS_DARK,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/ColorsLight.ts b/packages/twenty-new-ui/src/theme/constants/ColorsLight.ts
new file mode 100644
index 00000000000..31d65c0f9fc
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/ColorsLight.ts
@@ -0,0 +1,9 @@
+import { MAIN_COLORS_LIGHT } from './MainColorsLight';
+import { SECONDARY_COLORS_LIGHT } from './SecondaryColorsLight';
+import { TRANSPARENT_COLORS_LIGHT } from './TransparentColorsLight';
+
+export const COLOR_LIGHT = {
+  ...MAIN_COLORS_LIGHT,
+  ...SECONDARY_COLORS_LIGHT,
+  transparent: TRANSPARENT_COLORS_LIGHT,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/DefaultThemeColorFallback.ts b/packages/twenty-new-ui/src/theme/constants/DefaultThemeColorFallback.ts
new file mode 100644
index 00000000000..ee3e470f075
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/DefaultThemeColorFallback.ts
@@ -0,0 +1,3 @@
+import { type ThemeColor } from './MainColorNames';
+
+export const DEFAULT_THEME_COLOR_FALLBACK: ThemeColor = 'gray';
diff --git a/packages/twenty-new-ui/src/theme/constants/FontCommon.ts b/packages/twenty-new-ui/src/theme/constants/FontCommon.ts
new file mode 100644
index 00000000000..65556c018d3
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/FontCommon.ts
@@ -0,0 +1,17 @@
+export const FONT_COMMON = {
+  size: {
+    xxs: '0.625rem',
+    xs: '0.85rem',
+    sm: '0.92rem',
+    md: '1rem',
+    lg: '1.23rem',
+    xl: '1.54rem',
+    xxl: '1.85rem',
+  },
+  weight: {
+    regular: 400,
+    medium: 500,
+    semiBold: 600,
+  },
+  family: 'Inter, sans-serif',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/FontDark.ts b/packages/twenty-new-ui/src/theme/constants/FontDark.ts
new file mode 100644
index 00000000000..e18570b5c4b
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/FontDark.ts
@@ -0,0 +1,16 @@
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+import { FONT_COMMON } from './FontCommon';
+import { GRAY_SCALE_DARK } from './GrayScaleDark';
+
+export const FONT_DARK = {
+  color: {
+    primary: GRAY_SCALE_DARK.gray12,
+    secondary: GRAY_SCALE_DARK.gray11,
+    tertiary: GRAY_SCALE_DARK.gray9,
+    light: GRAY_SCALE_DARK.gray8,
+    extraLight: GRAY_SCALE_DARK.gray7,
+    inverted: GRAY_SCALE_DARK.gray1,
+    danger: COLOR_DARK.red,
+  },
+  ...FONT_COMMON,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/FontLight.ts b/packages/twenty-new-ui/src/theme/constants/FontLight.ts
new file mode 100644
index 00000000000..ec00f79108d
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/FontLight.ts
@@ -0,0 +1,16 @@
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+import { FONT_COMMON } from './FontCommon';
+import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
+
+export const FONT_LIGHT = {
+  color: {
+    primary: GRAY_SCALE_LIGHT.gray12,
+    secondary: GRAY_SCALE_LIGHT.gray11,
+    tertiary: GRAY_SCALE_LIGHT.gray9,
+    light: GRAY_SCALE_LIGHT.gray8,
+    extraLight: GRAY_SCALE_LIGHT.gray7,
+    inverted: GRAY_SCALE_LIGHT.gray1,
+    danger: COLOR_LIGHT.red,
+  },
+  ...FONT_COMMON,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/GrayScaleDark.ts b/packages/twenty-new-ui/src/theme/constants/GrayScaleDark.ts
new file mode 100644
index 00000000000..b6c7137cdb7
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/GrayScaleDark.ts
@@ -0,0 +1,14 @@
+export const GRAY_SCALE_DARK = {
+  gray1: 'color(display-p3 0.09 0.09 0.09)',
+  gray2: 'color(display-p3 0.106 0.106 0.106)',
+  gray3: 'color(display-p3 0.098 0.098 0.098)',
+  gray4: 'color(display-p3 0.114 0.114 0.114)',
+  gray5: 'color(display-p3 0.133 0.133 0.133)',
+  gray6: 'color(display-p3 0.282 0.282 0.282)',
+  gray7: 'color(display-p3 0.298 0.298 0.298)',
+  gray8: 'color(display-p3 0.4 0.4 0.4)',
+  gray9: 'color(display-p3 0.506 0.506 0.506)',
+  gray10: 'color(display-p3 0.482 0.482 0.482)',
+  gray11: 'color(display-p3 0.702 0.702 0.702)',
+  gray12: 'color(display-p3 0.922 0.922 0.922)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/GrayScaleDarkAlpha.ts b/packages/twenty-new-ui/src/theme/constants/GrayScaleDarkAlpha.ts
new file mode 100644
index 00000000000..76d05e33fa2
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/GrayScaleDarkAlpha.ts
@@ -0,0 +1,14 @@
+export const GRAY_SCALE_DARK_ALPHA = {
+  gray1: 'color(display-p3 1 1 1 / 0.031)',
+  gray2: 'color(display-p3 1 1 1 / 0.059)',
+  gray3: 'color(display-p3 1 1 1 / 0.047)',
+  gray4: 'color(display-p3 1 1 1 / 0.071)',
+  gray5: 'color(display-p3 1 1 1 / 0.102)',
+  gray6: 'color(display-p3 1 1 1 / 0.114)',
+  gray7: 'color(display-p3 1 1 1 / 0.141)',
+  gray8: 'color(display-p3 1 1 1 / 0.22)',
+  gray9: 'color(display-p3 1 1 1 / 0.427)',
+  gray10: 'color(display-p3 1 1 1 / 0.478)',
+  gray11: 'color(display-p3 1 1 1 / 0.565)',
+  gray12: 'color(display-p3 1 1 1 / 0.91)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/GrayScaleLight.ts b/packages/twenty-new-ui/src/theme/constants/GrayScaleLight.ts
new file mode 100644
index 00000000000..8a6796129fd
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/GrayScaleLight.ts
@@ -0,0 +1,14 @@
+export const GRAY_SCALE_LIGHT = {
+  gray1: 'color(display-p3 1 1 1)',
+  gray2: 'color(display-p3 0.988 0.988 0.988)',
+  gray3: 'color(display-p3 0.976 0.976 0.976)',
+  gray4: 'color(display-p3 0.945 0.945 0.945)',
+  gray5: 'color(display-p3 0.922 0.922 0.922)',
+  gray6: 'color(display-p3 0.839 0.839 0.839)',
+  gray7: 'color(display-p3 0.8 0.8 0.8)',
+  gray8: 'color(display-p3 0.702 0.702 0.702)',
+  gray9: 'color(display-p3 0.6 0.6 0.6)',
+  gray10: 'color(display-p3 0.514 0.514 0.514)',
+  gray11: 'color(display-p3 0.4 0.4 0.4)',
+  gray12: 'color(display-p3 0.2 0.2 0.2)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/GrayScaleLightAlpha.ts b/packages/twenty-new-ui/src/theme/constants/GrayScaleLightAlpha.ts
new file mode 100644
index 00000000000..954c2c51085
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/GrayScaleLightAlpha.ts
@@ -0,0 +1,14 @@
+export const GRAY_SCALE_LIGHT_ALPHA = {
+  gray1: 'color(display-p3 0 0 0 / 0.02)',
+  gray2: 'color(display-p3 0 0 0 / 0.039)',
+  gray3: 'color(display-p3 0 0 0 / 0.047)',
+  gray4: 'color(display-p3 0 0 0 / 0.071)',
+  gray5: 'color(display-p3 0 0 0 / 0.078)',
+  gray6: 'color(display-p3 0 0 0 / 0.114)',
+  gray7: 'color(display-p3 0 0 0 / 0.161)',
+  gray8: 'color(display-p3 0 0 0 / 0.22)',
+  gray9: 'color(display-p3 0 0 0 / 0.361)',
+  gray10: 'color(display-p3 0 0 0 / 0.478)',
+  gray11: 'color(display-p3 0 0 0 / 0.722)',
+  gray12: 'color(display-p3 0 0 0 / 0.91)',
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/Icon.ts b/packages/twenty-new-ui/src/theme/constants/Icon.ts
new file mode 100644
index 00000000000..cfe9cbc7942
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/Icon.ts
@@ -0,0 +1,13 @@
+export const ICON = {
+  size: {
+    sm: 14,
+    md: 16,
+    lg: 20,
+    xl: 24,
+  },
+  stroke: {
+    sm: 1.6,
+    md: 2,
+    lg: 2.5,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/IllustrationIconDark.ts b/packages/twenty-new-ui/src/theme/constants/IllustrationIconDark.ts
new file mode 100644
index 00000000000..9d4ba4f561d
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/IllustrationIconDark.ts
@@ -0,0 +1,13 @@
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+import { GRAY_SCALE_DARK } from '@new-ui/theme/constants/GrayScaleDark';
+
+export const ILLUSTRATION_ICON_DARK = {
+  color: {
+    blue: COLOR_DARK.blue10,
+    gray: GRAY_SCALE_DARK.gray8,
+  },
+  fill: {
+    blue: COLOR_DARK.blue12,
+    gray: GRAY_SCALE_DARK.gray5,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/IllustrationIconLight.ts b/packages/twenty-new-ui/src/theme/constants/IllustrationIconLight.ts
new file mode 100644
index 00000000000..501f8f318b5
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/IllustrationIconLight.ts
@@ -0,0 +1,13 @@
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+import { GRAY_SCALE_LIGHT } from '@new-ui/theme/constants/GrayScaleLight';
+
+export const ILLUSTRATION_ICON_LIGHT = {
+  color: {
+    blue: COLOR_LIGHT.blue8,
+    gray: GRAY_SCALE_LIGHT.gray9,
+  },
+  fill: {
+    blue: COLOR_LIGHT.blue5,
+    gray: GRAY_SCALE_LIGHT.gray5,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/MainColorNames.ts b/packages/twenty-new-ui/src/theme/constants/MainColorNames.ts
new file mode 100644
index 00000000000..36b4d812cb2
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/MainColorNames.ts
@@ -0,0 +1,5 @@
+import { MAIN_COLORS_LIGHT } from './MainColorsLight';
+
+export const MAIN_COLOR_NAMES = Object.keys(MAIN_COLORS_LIGHT) as ThemeColor[];
+
+export type ThemeColor = keyof typeof MAIN_COLORS_LIGHT;
diff --git a/packages/twenty-new-ui/src/theme/constants/MainColorsDark.ts b/packages/twenty-new-ui/src/theme/constants/MainColorsDark.ts
new file mode 100644
index 00000000000..eb7e6bb9878
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/MainColorsDark.ts
@@ -0,0 +1,41 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_DARK } from '@new-ui/theme/constants/GrayScaleDark';
+
+export const MAIN_COLORS_DARK = {
+  // Reds
+  red: RadixColors.redDarkP3.red9,
+  ruby: RadixColors.rubyDarkP3.ruby9,
+  crimson: RadixColors.crimsonDarkP3.crimson9,
+  tomato: RadixColors.tomatoDarkP3.tomato9,
+
+  // Oranges & Yellows
+  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,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/MainColorsLight.ts b/packages/twenty-new-ui/src/theme/constants/MainColorsLight.ts
new file mode 100644
index 00000000000..4a00386d134
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/MainColorsLight.ts
@@ -0,0 +1,41 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
+
+export const MAIN_COLORS_LIGHT = {
+  // Reds
+  red: RadixColors.redP3.red9,
+  ruby: RadixColors.rubyP3.ruby9,
+  crimson: RadixColors.crimsonP3.crimson9,
+  tomato: RadixColors.tomatoP3.tomato9,
+
+  // Oranges & Yellows
+  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.gray9,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/Modal.ts b/packages/twenty-new-ui/src/theme/constants/Modal.ts
new file mode 100644
index 00000000000..823e5568c42
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/Modal.ts
@@ -0,0 +1,23 @@
+export const MODAL: {
+  size: { [key: string]: { width?: string; height?: string } };
+} = {
+  size: {
+    sm: {
+      width: '300px',
+    },
+    md: {
+      width: '400px',
+    },
+    lg: {
+      width: '53%',
+    },
+    xl: {
+      width: '1200px',
+      height: '800px',
+    },
+    fullscreen: {
+      width: '100dvw',
+      height: '100dvh',
+    },
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/Rgba.ts b/packages/twenty-new-ui/src/theme/constants/Rgba.ts
new file mode 100644
index 00000000000..d36cfcd5d10
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/Rgba.ts
@@ -0,0 +1,8 @@
+/* oxlint-disable twenty/no-hardcoded-colors */
+import hexRgb from 'hex-rgb';
+
+export const RGBA = (hex: string, alpha: number) => {
+  return `rgba(${hexRgb(hex, { format: 'array' })
+    .slice(0, -1)
+    .join(',')},${alpha})`;
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/SecondaryColorsDark.ts b/packages/twenty-new-ui/src/theme/constants/SecondaryColorsDark.ts
new file mode 100644
index 00000000000..1792dc92903
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/SecondaryColorsDark.ts
@@ -0,0 +1,394 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_DARK } from '@new-ui/theme/constants/GrayScaleDark';
+
+export const SECONDARY_COLORS_DARK = {
+  yellow1: RadixColors.yellowDarkP3.yellow1,
+  yellow2: RadixColors.yellowDarkP3.yellow2,
+  yellow3: RadixColors.yellowDarkP3.yellow3,
+  yellow4: RadixColors.yellowDarkP3.yellow4,
+  yellow5: RadixColors.yellowDarkP3.yellow5,
+  yellow6: RadixColors.yellowDarkP3.yellow6,
+  yellow7: RadixColors.yellowDarkP3.yellow7,
+  yellow8: RadixColors.yellowDarkP3.yellow8,
+  yellow9: RadixColors.yellowDarkP3.yellow9,
+  yellow10: RadixColors.yellowDarkP3.yellow10,
+  yellow11: RadixColors.yellowDarkP3.yellow11,
+  yellow12: RadixColors.yellowDarkP3.yellow12,
+
+  green1: RadixColors.greenDarkP3.green1,
+  green2: RadixColors.greenDarkP3.green2,
+  green3: RadixColors.greenDarkP3.green3,
+  green4: RadixColors.greenDarkP3.green4,
+  green5: RadixColors.greenDarkP3.green5,
+  green6: RadixColors.greenDarkP3.green6,
+  green7: RadixColors.greenDarkP3.green7,
+  green8: RadixColors.greenDarkP3.green8,
+  green9: RadixColors.greenDarkP3.green9,
+  green10: RadixColors.greenDarkP3.green10,
+  green11: RadixColors.greenDarkP3.green11,
+  green12: RadixColors.greenDarkP3.green12,
+
+  turquoise1: RadixColors.tealDarkP3.teal1,
+  turquoise2: RadixColors.tealDarkP3.teal2,
+  turquoise3: RadixColors.tealDarkP3.teal3,
+  turquoise4: RadixColors.tealDarkP3.teal4,
+  turquoise5: RadixColors.tealDarkP3.teal5,
+  turquoise6: RadixColors.tealDarkP3.teal6,
+  turquoise7: RadixColors.tealDarkP3.teal7,
+  turquoise8: RadixColors.tealDarkP3.teal8,
+  turquoise9: RadixColors.tealDarkP3.teal9,
+  turquoise10: RadixColors.tealDarkP3.teal10,
+  turquoise11: RadixColors.tealDarkP3.teal11,
+  turquoise12: RadixColors.tealDarkP3.teal12,
+
+  sky1: RadixColors.skyDarkP3.sky1,
+  sky2: RadixColors.skyDarkP3.sky2,
+  sky3: RadixColors.skyDarkP3.sky3,
+  sky4: RadixColors.skyDarkP3.sky4,
+  sky5: RadixColors.skyDarkP3.sky5,
+  sky6: RadixColors.skyDarkP3.sky6,
+  sky7: RadixColors.skyDarkP3.sky7,
+  sky8: RadixColors.skyDarkP3.sky8,
+  sky9: RadixColors.skyP3.sky9,
+  sky10: RadixColors.skyDarkP3.sky10,
+  sky11: RadixColors.skyDarkP3.sky11,
+  sky12: RadixColors.skyDarkP3.sky12,
+
+  blue1: RadixColors.indigoDarkP3.indigo1,
+  blue2: RadixColors.indigoDarkP3.indigo2,
+  blue3: RadixColors.indigoDarkP3.indigo3,
+  blue4: RadixColors.indigoDarkP3.indigo4,
+  blue5: RadixColors.indigoDarkP3.indigo5,
+  blue6: RadixColors.indigoDarkP3.indigo6,
+  blue7: RadixColors.indigoDarkP3.indigo7,
+  blue8: RadixColors.indigoDarkP3.indigo8,
+  blue9: RadixColors.indigoDarkP3.indigo9,
+  blue10: RadixColors.indigoDarkP3.indigo10,
+  blue11: RadixColors.indigoDarkP3.indigo11,
+  blue12: RadixColors.indigoDarkP3.indigo12,
+
+  purple1: RadixColors.purpleDarkP3.purple1,
+  purple2: RadixColors.purpleDarkP3.purple2,
+  purple3: RadixColors.purpleDarkP3.purple3,
+  purple4: RadixColors.purpleDarkP3.purple4,
+  purple5: RadixColors.purpleDarkP3.purple5,
+  purple6: RadixColors.purpleDarkP3.purple6,
+  purple7: RadixColors.purpleDarkP3.purple7,
+  purple8: RadixColors.purpleDarkP3.purple8,
+  purple9: RadixColors.purpleDarkP3.purple9,
+  purple10: RadixColors.purpleDarkP3.purple10,
+  purple11: RadixColors.purpleDarkP3.purple11,
+  purple12: RadixColors.purpleDarkP3.purple12,
+
+  pink1: RadixColors.pinkDarkP3.pink1,
+  pink2: RadixColors.pinkDarkP3.pink2,
+  pink3: RadixColors.pinkDarkP3.pink3,
+  pink4: RadixColors.pinkDarkP3.pink4,
+  pink5: RadixColors.pinkDarkP3.pink5,
+  pink6: RadixColors.pinkDarkP3.pink6,
+  pink7: RadixColors.pinkDarkP3.pink7,
+  pink8: RadixColors.pinkDarkP3.pink8,
+  pink9: RadixColors.pinkDarkP3.pink9,
+  pink10: RadixColors.pinkDarkP3.pink10,
+  pink11: RadixColors.pinkDarkP3.pink11,
+  pink12: RadixColors.pinkDarkP3.pink12,
+
+  red1: RadixColors.redDarkP3.red1,
+  red2: RadixColors.redDarkP3.red2,
+  red3: RadixColors.redDarkP3.red3,
+  red4: RadixColors.redDarkP3.red4,
+  red5: RadixColors.redDarkP3.red5,
+  red6: RadixColors.redDarkP3.red6,
+  red7: RadixColors.redDarkP3.red7,
+  red8: RadixColors.redDarkP3.red8,
+  red9: RadixColors.redDarkP3.red9,
+  red10: RadixColors.redDarkP3.red10,
+  red11: RadixColors.redDarkP3.red11,
+  red12: RadixColors.redDarkP3.red12,
+
+  orange1: RadixColors.orangeDarkP3.orange1,
+  orange2: RadixColors.orangeDarkP3.orange2,
+  orange3: RadixColors.orangeDarkP3.orange3,
+  orange4: RadixColors.orangeDarkP3.orange4,
+  orange5: RadixColors.orangeDarkP3.orange5,
+  orange6: RadixColors.orangeDarkP3.orange6,
+  orange7: RadixColors.orangeDarkP3.orange7,
+  orange8: RadixColors.orangeDarkP3.orange8,
+  orange9: RadixColors.orangeDarkP3.orange9,
+  orange10: RadixColors.orangeDarkP3.orange10,
+  orange11: RadixColors.orangeDarkP3.orange11,
+  orange12: RadixColors.orangeDarkP3.orange12,
+
+  gray1: GRAY_SCALE_DARK.gray1,
+  gray2: GRAY_SCALE_DARK.gray2,
+  gray3: GRAY_SCALE_DARK.gray3,
+  gray4: GRAY_SCALE_DARK.gray4,
+  gray5: GRAY_SCALE_DARK.gray5,
+  gray6: GRAY_SCALE_DARK.gray6,
+  gray7: GRAY_SCALE_DARK.gray7,
+  gray8: GRAY_SCALE_DARK.gray8,
+  gray9: GRAY_SCALE_DARK.gray9,
+  gray10: GRAY_SCALE_DARK.gray10,
+  gray11: GRAY_SCALE_DARK.gray11,
+  gray12: GRAY_SCALE_DARK.gray12,
+
+  mauve1: RadixColors.mauveDarkP3.mauve1,
+  mauve2: RadixColors.mauveDarkP3.mauve2,
+  mauve3: RadixColors.mauveDarkP3.mauve3,
+  mauve4: RadixColors.mauveDarkP3.mauve4,
+  mauve5: RadixColors.mauveDarkP3.mauve5,
+  mauve6: RadixColors.mauveDarkP3.mauve6,
+  mauve7: RadixColors.mauveDarkP3.mauve7,
+  mauve8: RadixColors.mauveDarkP3.mauve8,
+  mauve9: RadixColors.mauveDarkP3.mauve9,
+  mauve10: RadixColors.mauveDarkP3.mauve10,
+  mauve11: RadixColors.mauveDarkP3.mauve11,
+  mauve12: RadixColors.mauveDarkP3.mauve12,
+
+  slate1: RadixColors.slateDarkP3.slate1,
+  slate2: RadixColors.slateDarkP3.slate2,
+  slate3: RadixColors.slateDarkP3.slate3,
+  slate4: RadixColors.slateDarkP3.slate4,
+  slate5: RadixColors.slateDarkP3.slate5,
+  slate6: RadixColors.slateDarkP3.slate6,
+  slate7: RadixColors.slateDarkP3.slate7,
+  slate8: RadixColors.slateDarkP3.slate8,
+  slate9: RadixColors.slateDarkP3.slate9,
+  slate10: RadixColors.slateDarkP3.slate10,
+  slate11: RadixColors.slateDarkP3.slate11,
+  slate12: RadixColors.slateDarkP3.slate12,
+
+  sage1: RadixColors.sageDarkP3.sage1,
+  sage2: RadixColors.sageDarkP3.sage2,
+  sage3: RadixColors.sageDarkP3.sage3,
+  sage4: RadixColors.sageDarkP3.sage4,
+  sage5: RadixColors.sageDarkP3.sage5,
+  sage6: RadixColors.sageDarkP3.sage6,
+  sage7: RadixColors.sageDarkP3.sage7,
+  sage8: RadixColors.sageDarkP3.sage8,
+  sage9: RadixColors.sageDarkP3.sage9,
+  sage10: RadixColors.sageDarkP3.sage10,
+  sage11: RadixColors.sageDarkP3.sage11,
+  sage12: RadixColors.sageDarkP3.sage12,
+
+  olive1: RadixColors.oliveDarkP3.olive1,
+  olive2: RadixColors.oliveDarkP3.olive2,
+  olive3: RadixColors.oliveDarkP3.olive3,
+  olive4: RadixColors.oliveDarkP3.olive4,
+  olive5: RadixColors.oliveDarkP3.olive5,
+  olive6: RadixColors.oliveDarkP3.olive6,
+  olive7: RadixColors.oliveDarkP3.olive7,
+  olive8: RadixColors.oliveDarkP3.olive8,
+  olive9: RadixColors.oliveDarkP3.olive9,
+  olive10: RadixColors.oliveDarkP3.olive10,
+  olive11: RadixColors.oliveDarkP3.olive11,
+  olive12: RadixColors.oliveDarkP3.olive12,
+
+  sand1: RadixColors.sandDarkP3.sand1,
+  sand2: RadixColors.sandDarkP3.sand2,
+  sand3: RadixColors.sandDarkP3.sand3,
+  sand4: RadixColors.sandDarkP3.sand4,
+  sand5: RadixColors.sandDarkP3.sand5,
+  sand6: RadixColors.sandDarkP3.sand6,
+  sand7: RadixColors.sandDarkP3.sand7,
+  sand8: RadixColors.sandDarkP3.sand8,
+  sand9: RadixColors.sandDarkP3.sand9,
+  sand10: RadixColors.sandDarkP3.sand10,
+  sand11: RadixColors.sandDarkP3.sand11,
+  sand12: RadixColors.sandDarkP3.sand12,
+
+  tomato1: RadixColors.tomatoDarkP3.tomato1,
+  tomato2: RadixColors.tomatoDarkP3.tomato2,
+  tomato3: RadixColors.tomatoDarkP3.tomato3,
+  tomato4: RadixColors.tomatoDarkP3.tomato4,
+  tomato5: RadixColors.tomatoDarkP3.tomato5,
+  tomato6: RadixColors.tomatoDarkP3.tomato6,
+  tomato7: RadixColors.tomatoDarkP3.tomato7,
+  tomato8: RadixColors.tomatoDarkP3.tomato8,
+  tomato9: RadixColors.tomatoDarkP3.tomato9,
+  tomato10: RadixColors.tomatoDarkP3.tomato10,
+  tomato11: RadixColors.tomatoDarkP3.tomato11,
+  tomato12: RadixColors.tomatoDarkP3.tomato12,
+
+  ruby1: RadixColors.rubyDarkP3.ruby1,
+  ruby2: RadixColors.rubyDarkP3.ruby2,
+  ruby3: RadixColors.rubyDarkP3.ruby3,
+  ruby4: RadixColors.rubyDarkP3.ruby4,
+  ruby5: RadixColors.rubyDarkP3.ruby5,
+  ruby6: RadixColors.rubyDarkP3.ruby6,
+  ruby7: RadixColors.rubyDarkP3.ruby7,
+  ruby8: RadixColors.rubyDarkP3.ruby8,
+  ruby9: RadixColors.rubyDarkP3.ruby9,
+  ruby10: RadixColors.rubyDarkP3.ruby10,
+  ruby11: RadixColors.rubyDarkP3.ruby11,
+  ruby12: RadixColors.rubyDarkP3.ruby12,
+
+  crimson1: RadixColors.crimsonDarkP3.crimson1,
+  crimson2: RadixColors.crimsonDarkP3.crimson2,
+  crimson3: RadixColors.crimsonDarkP3.crimson3,
+  crimson4: RadixColors.crimsonDarkP3.crimson4,
+  crimson5: RadixColors.crimsonDarkP3.crimson5,
+  crimson6: RadixColors.crimsonDarkP3.crimson6,
+  crimson7: RadixColors.crimsonDarkP3.crimson7,
+  crimson8: RadixColors.crimsonDarkP3.crimson8,
+  crimson9: RadixColors.crimsonDarkP3.crimson9,
+  crimson10: RadixColors.crimsonDarkP3.crimson10,
+  crimson11: RadixColors.crimsonDarkP3.crimson11,
+  crimson12: RadixColors.crimsonDarkP3.crimson12,
+
+  plum1: RadixColors.plumDarkP3.plum1,
+  plum2: RadixColors.plumDarkP3.plum2,
+  plum3: RadixColors.plumDarkP3.plum3,
+  plum4: RadixColors.plumDarkP3.plum4,
+  plum5: RadixColors.plumDarkP3.plum5,
+  plum6: RadixColors.plumDarkP3.plum6,
+  plum7: RadixColors.plumDarkP3.plum7,
+  plum8: RadixColors.plumDarkP3.plum8,
+  plum9: RadixColors.plumDarkP3.plum9,
+  plum10: RadixColors.plumDarkP3.plum10,
+  plum11: RadixColors.plumDarkP3.plum11,
+  plum12: RadixColors.plumDarkP3.plum12,
+
+  violet1: RadixColors.violetDarkP3.violet1,
+  violet2: RadixColors.violetDarkP3.violet2,
+  violet3: RadixColors.violetDarkP3.violet3,
+  violet4: RadixColors.violetDarkP3.violet4,
+  violet5: RadixColors.violetDarkP3.violet5,
+  violet6: RadixColors.violetDarkP3.violet6,
+  violet7: RadixColors.violetDarkP3.violet7,
+  violet8: RadixColors.violetDarkP3.violet8,
+  violet9: RadixColors.violetDarkP3.violet9,
+  violet10: RadixColors.violetDarkP3.violet10,
+  violet11: RadixColors.violetDarkP3.violet11,
+  violet12: RadixColors.violetDarkP3.violet12,
+
+  iris1: RadixColors.irisDarkP3.iris1,
+  iris2: RadixColors.irisDarkP3.iris2,
+  iris3: RadixColors.irisDarkP3.iris3,
+  iris4: RadixColors.irisDarkP3.iris4,
+  iris5: RadixColors.irisDarkP3.iris5,
+  iris6: RadixColors.irisDarkP3.iris6,
+  iris7: RadixColors.irisDarkP3.iris7,
+  iris8: RadixColors.irisDarkP3.iris8,
+  iris9: RadixColors.irisDarkP3.iris9,
+  iris10: RadixColors.irisDarkP3.iris10,
+  iris11: RadixColors.irisDarkP3.iris11,
+  iris12: RadixColors.irisDarkP3.iris12,
+
+  cyan1: RadixColors.cyanDarkP3.cyan1,
+  cyan2: RadixColors.cyanDarkP3.cyan2,
+  cyan3: RadixColors.cyanDarkP3.cyan3,
+  cyan4: RadixColors.cyanDarkP3.cyan4,
+  cyan5: RadixColors.cyanDarkP3.cyan5,
+  cyan6: RadixColors.cyanDarkP3.cyan6,
+  cyan7: RadixColors.cyanDarkP3.cyan7,
+  cyan8: RadixColors.cyanDarkP3.cyan8,
+  cyan9: RadixColors.cyanDarkP3.cyan9,
+  cyan10: RadixColors.cyanDarkP3.cyan10,
+  cyan11: RadixColors.cyanDarkP3.cyan11,
+  cyan12: RadixColors.cyanDarkP3.cyan12,
+
+  jade1: RadixColors.jadeDarkP3.jade1,
+  jade2: RadixColors.jadeDarkP3.jade2,
+  jade3: RadixColors.jadeDarkP3.jade3,
+  jade4: RadixColors.jadeDarkP3.jade4,
+  jade5: RadixColors.jadeDarkP3.jade5,
+  jade6: RadixColors.jadeDarkP3.jade6,
+  jade7: RadixColors.jadeDarkP3.jade7,
+  jade8: RadixColors.jadeDarkP3.jade8,
+  jade9: RadixColors.jadeDarkP3.jade9,
+  jade10: RadixColors.jadeDarkP3.jade10,
+  jade11: RadixColors.jadeDarkP3.jade11,
+  jade12: RadixColors.jadeDarkP3.jade12,
+
+  grass1: RadixColors.grassDarkP3.grass1,
+  grass2: RadixColors.grassDarkP3.grass2,
+  grass3: RadixColors.grassDarkP3.grass3,
+  grass4: RadixColors.grassDarkP3.grass4,
+  grass5: RadixColors.grassDarkP3.grass5,
+  grass6: RadixColors.grassDarkP3.grass6,
+  grass7: RadixColors.grassDarkP3.grass7,
+  grass8: RadixColors.grassDarkP3.grass8,
+  grass9: RadixColors.grassDarkP3.grass9,
+  grass10: RadixColors.grassDarkP3.grass10,
+  grass11: RadixColors.grassDarkP3.grass11,
+  grass12: RadixColors.grassDarkP3.grass12,
+
+  mint1: RadixColors.mintDarkP3.mint1,
+  mint2: RadixColors.mintDarkP3.mint2,
+  mint3: RadixColors.mintDarkP3.mint3,
+  mint4: RadixColors.mintDarkP3.mint4,
+  mint5: RadixColors.mintDarkP3.mint5,
+  mint6: RadixColors.mintDarkP3.mint6,
+  mint7: RadixColors.mintDarkP3.mint7,
+  mint8: RadixColors.mintDarkP3.mint8,
+  mint9: RadixColors.mintDarkP3.mint9,
+  mint10: RadixColors.mintDarkP3.mint10,
+  mint11: RadixColors.mintDarkP3.mint11,
+  mint12: RadixColors.mintDarkP3.mint12,
+
+  lime1: RadixColors.limeDarkP3.lime1,
+  lime2: RadixColors.limeDarkP3.lime2,
+  lime3: RadixColors.limeDarkP3.lime3,
+  lime4: RadixColors.limeDarkP3.lime4,
+  lime5: RadixColors.limeDarkP3.lime5,
+  lime6: RadixColors.limeDarkP3.lime6,
+  lime7: RadixColors.limeDarkP3.lime7,
+  lime8: RadixColors.limeDarkP3.lime8,
+  lime9: RadixColors.limeDarkP3.lime9,
+  lime10: RadixColors.limeDarkP3.lime10,
+  lime11: RadixColors.limeDarkP3.lime11,
+  lime12: RadixColors.limeDarkP3.lime12,
+
+  bronze1: RadixColors.bronzeDarkP3.bronze1,
+  bronze2: RadixColors.bronzeDarkP3.bronze2,
+  bronze3: RadixColors.bronzeDarkP3.bronze3,
+  bronze4: RadixColors.bronzeDarkP3.bronze4,
+  bronze5: RadixColors.bronzeDarkP3.bronze5,
+  bronze6: RadixColors.bronzeDarkP3.bronze6,
+  bronze7: RadixColors.bronzeDarkP3.bronze7,
+  bronze8: RadixColors.bronzeDarkP3.bronze8,
+  bronze9: RadixColors.bronzeDarkP3.bronze9,
+  bronze10: RadixColors.bronzeDarkP3.bronze10,
+  bronze11: RadixColors.bronzeDarkP3.bronze11,
+  bronze12: RadixColors.bronzeDarkP3.bronze12,
+
+  gold1: RadixColors.goldDarkP3.gold1,
+  gold2: RadixColors.goldDarkP3.gold2,
+  gold3: RadixColors.goldDarkP3.gold3,
+  gold4: RadixColors.goldDarkP3.gold4,
+  gold5: RadixColors.goldDarkP3.gold5,
+  gold6: RadixColors.goldDarkP3.gold6,
+  gold7: RadixColors.goldDarkP3.gold7,
+  gold8: RadixColors.goldDarkP3.gold8,
+  gold9: RadixColors.goldDarkP3.gold9,
+  gold10: RadixColors.goldDarkP3.gold10,
+  gold11: RadixColors.goldDarkP3.gold11,
+  gold12: RadixColors.goldDarkP3.gold12,
+
+  brown1: RadixColors.brownDarkP3.brown1,
+  brown2: RadixColors.brownDarkP3.brown2,
+  brown3: RadixColors.brownDarkP3.brown3,
+  brown4: RadixColors.brownDarkP3.brown4,
+  brown5: RadixColors.brownDarkP3.brown5,
+  brown6: RadixColors.brownDarkP3.brown6,
+  brown7: RadixColors.brownDarkP3.brown7,
+  brown8: RadixColors.brownDarkP3.brown8,
+  brown9: RadixColors.brownDarkP3.brown9,
+  brown10: RadixColors.brownDarkP3.brown10,
+  brown11: RadixColors.brownDarkP3.brown11,
+  brown12: RadixColors.brownDarkP3.brown12,
+
+  amber1: RadixColors.amberDarkP3.amber1,
+  amber2: RadixColors.amberDarkP3.amber2,
+  amber3: RadixColors.amberDarkP3.amber3,
+  amber4: RadixColors.amberDarkP3.amber4,
+  amber5: RadixColors.amberDarkP3.amber5,
+  amber6: RadixColors.amberDarkP3.amber6,
+  amber7: RadixColors.amberDarkP3.amber7,
+  amber8: RadixColors.amberDarkP3.amber8,
+  amber9: RadixColors.amberDarkP3.amber9,
+  amber10: RadixColors.amberDarkP3.amber10,
+  amber11: RadixColors.amberDarkP3.amber11,
+  amber12: RadixColors.amberDarkP3.amber12,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/SecondaryColorsLight.ts b/packages/twenty-new-ui/src/theme/constants/SecondaryColorsLight.ts
new file mode 100644
index 00000000000..755c81773b0
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/SecondaryColorsLight.ts
@@ -0,0 +1,394 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_LIGHT } from './GrayScaleLight';
+
+export const SECONDARY_COLORS_LIGHT = {
+  yellow1: RadixColors.yellowP3.yellow1,
+  yellow2: RadixColors.yellowP3.yellow2,
+  yellow3: RadixColors.yellowP3.yellow3,
+  yellow4: RadixColors.yellowP3.yellow4,
+  yellow5: RadixColors.yellowP3.yellow5,
+  yellow6: RadixColors.yellowP3.yellow6,
+  yellow7: RadixColors.yellowP3.yellow7,
+  yellow8: RadixColors.yellowP3.yellow8,
+  yellow9: RadixColors.yellowP3.yellow9,
+  yellow10: RadixColors.yellowP3.yellow10,
+  yellow11: RadixColors.yellowP3.yellow11,
+  yellow12: RadixColors.yellowP3.yellow12,
+
+  green1: RadixColors.greenP3.green1,
+  green2: RadixColors.greenP3.green2,
+  green3: RadixColors.greenP3.green3,
+  green4: RadixColors.greenP3.green4,
+  green5: RadixColors.greenP3.green5,
+  green6: RadixColors.greenP3.green6,
+  green7: RadixColors.greenP3.green7,
+  green8: RadixColors.greenP3.green8,
+  green9: RadixColors.greenP3.green9,
+  green10: RadixColors.greenP3.green10,
+  green11: RadixColors.greenP3.green11,
+  green12: RadixColors.greenP3.green12,
+
+  turquoise1: RadixColors.tealP3.teal1,
+  turquoise2: RadixColors.tealP3.teal2,
+  turquoise3: RadixColors.tealP3.teal3,
+  turquoise4: RadixColors.tealP3.teal4,
+  turquoise5: RadixColors.tealP3.teal5,
+  turquoise6: RadixColors.tealP3.teal6,
+  turquoise7: RadixColors.tealP3.teal7,
+  turquoise8: RadixColors.tealP3.teal8,
+  turquoise9: RadixColors.tealP3.teal9,
+  turquoise10: RadixColors.tealP3.teal10,
+  turquoise11: RadixColors.tealP3.teal11,
+  turquoise12: RadixColors.tealP3.teal12,
+
+  sky1: RadixColors.skyP3.sky1,
+  sky2: RadixColors.skyP3.sky2,
+  sky3: RadixColors.skyP3.sky3,
+  sky4: RadixColors.skyP3.sky4,
+  sky5: RadixColors.skyP3.sky5,
+  sky6: RadixColors.skyP3.sky6,
+  sky7: RadixColors.skyP3.sky7,
+  sky8: RadixColors.skyP3.sky8,
+  sky9: RadixColors.skyP3.sky9,
+  sky10: RadixColors.skyP3.sky10,
+  sky11: RadixColors.skyP3.sky11,
+  sky12: RadixColors.skyP3.sky12,
+
+  blue1: RadixColors.indigoP3.indigo1,
+  blue2: RadixColors.indigoP3.indigo2,
+  blue3: RadixColors.indigoP3.indigo3,
+  blue4: RadixColors.indigoP3.indigo4,
+  blue5: RadixColors.indigoP3.indigo5,
+  blue6: RadixColors.indigoP3.indigo6,
+  blue7: RadixColors.indigoP3.indigo7,
+  blue8: RadixColors.indigoP3.indigo8,
+  blue9: RadixColors.indigoP3.indigo9,
+  blue10: RadixColors.indigoP3.indigo10,
+  blue11: RadixColors.indigoP3.indigo11,
+  blue12: RadixColors.indigoP3.indigo12,
+
+  purple1: RadixColors.purpleP3.purple1,
+  purple2: RadixColors.purpleP3.purple2,
+  purple3: RadixColors.purpleP3.purple3,
+  purple4: RadixColors.purpleP3.purple4,
+  purple5: RadixColors.purpleP3.purple5,
+  purple6: RadixColors.purpleP3.purple6,
+  purple7: RadixColors.purpleP3.purple7,
+  purple8: RadixColors.purpleP3.purple8,
+  purple9: RadixColors.purpleP3.purple9,
+  purple10: RadixColors.purpleP3.purple10,
+  purple11: RadixColors.purpleP3.purple11,
+  purple12: RadixColors.purpleP3.purple12,
+
+  pink1: RadixColors.pinkP3.pink1,
+  pink2: RadixColors.pinkP3.pink2,
+  pink3: RadixColors.pinkP3.pink3,
+  pink4: RadixColors.pinkP3.pink4,
+  pink5: RadixColors.pinkP3.pink5,
+  pink6: RadixColors.pinkP3.pink6,
+  pink7: RadixColors.pinkP3.pink7,
+  pink8: RadixColors.pinkP3.pink8,
+  pink9: RadixColors.pinkP3.pink9,
+  pink10: RadixColors.pinkP3.pink10,
+  pink11: RadixColors.pinkP3.pink11,
+  pink12: RadixColors.pinkP3.pink12,
+
+  red1: RadixColors.redP3.red1,
+  red2: RadixColors.redP3.red2,
+  red3: RadixColors.redP3.red3,
+  red4: RadixColors.redP3.red4,
+  red5: RadixColors.redP3.red5,
+  red6: RadixColors.redP3.red6,
+  red7: RadixColors.redP3.red7,
+  red8: RadixColors.redP3.red8,
+  red9: RadixColors.redP3.red9,
+  red10: RadixColors.redP3.red10,
+  red11: RadixColors.redP3.red11,
+  red12: RadixColors.redP3.red12,
+
+  orange1: RadixColors.orangeP3.orange1,
+  orange2: RadixColors.orangeP3.orange2,
+  orange3: RadixColors.orangeP3.orange3,
+  orange4: RadixColors.orangeP3.orange4,
+  orange5: RadixColors.orangeP3.orange5,
+  orange6: RadixColors.orangeP3.orange6,
+  orange7: RadixColors.orangeP3.orange7,
+  orange8: RadixColors.orangeP3.orange8,
+  orange9: RadixColors.orangeP3.orange9,
+  orange10: RadixColors.orangeP3.orange10,
+  orange11: RadixColors.orangeP3.orange11,
+  orange12: RadixColors.orangeP3.orange12,
+
+  gray1: GRAY_SCALE_LIGHT.gray1,
+  gray2: GRAY_SCALE_LIGHT.gray2,
+  gray3: GRAY_SCALE_LIGHT.gray3,
+  gray4: GRAY_SCALE_LIGHT.gray4,
+  gray5: GRAY_SCALE_LIGHT.gray5,
+  gray6: GRAY_SCALE_LIGHT.gray6,
+  gray7: GRAY_SCALE_LIGHT.gray7,
+  gray8: GRAY_SCALE_LIGHT.gray8,
+  gray9: GRAY_SCALE_LIGHT.gray9,
+  gray10: GRAY_SCALE_LIGHT.gray10,
+  gray11: GRAY_SCALE_LIGHT.gray11,
+  gray12: GRAY_SCALE_LIGHT.gray12,
+
+  mauve1: RadixColors.mauveP3.mauve1,
+  mauve2: RadixColors.mauveP3.mauve2,
+  mauve3: RadixColors.mauveP3.mauve3,
+  mauve4: RadixColors.mauveP3.mauve4,
+  mauve5: RadixColors.mauveP3.mauve5,
+  mauve6: RadixColors.mauveP3.mauve6,
+  mauve7: RadixColors.mauveP3.mauve7,
+  mauve8: RadixColors.mauveP3.mauve8,
+  mauve9: RadixColors.mauveP3.mauve9,
+  mauve10: RadixColors.mauveP3.mauve10,
+  mauve11: RadixColors.mauveP3.mauve11,
+  mauve12: RadixColors.mauveP3.mauve12,
+
+  slate1: RadixColors.slateP3.slate1,
+  slate2: RadixColors.slateP3.slate2,
+  slate3: RadixColors.slateP3.slate3,
+  slate4: RadixColors.slateP3.slate4,
+  slate5: RadixColors.slateP3.slate5,
+  slate6: RadixColors.slateP3.slate6,
+  slate7: RadixColors.slateP3.slate7,
+  slate8: RadixColors.slateP3.slate8,
+  slate9: RadixColors.slateP3.slate9,
+  slate10: RadixColors.slateP3.slate10,
+  slate11: RadixColors.slateP3.slate11,
+  slate12: RadixColors.slateP3.slate12,
+
+  sage1: RadixColors.sageP3.sage1,
+  sage2: RadixColors.sageP3.sage2,
+  sage3: RadixColors.sageP3.sage3,
+  sage4: RadixColors.sageP3.sage4,
+  sage5: RadixColors.sageP3.sage5,
+  sage6: RadixColors.sageP3.sage6,
+  sage7: RadixColors.sageP3.sage7,
+  sage8: RadixColors.sageP3.sage8,
+  sage9: RadixColors.sageP3.sage9,
+  sage10: RadixColors.sageP3.sage10,
+  sage11: RadixColors.sageP3.sage11,
+  sage12: RadixColors.sageP3.sage12,
+
+  olive1: RadixColors.oliveP3.olive1,
+  olive2: RadixColors.oliveP3.olive2,
+  olive3: RadixColors.oliveP3.olive3,
+  olive4: RadixColors.oliveP3.olive4,
+  olive5: RadixColors.oliveP3.olive5,
+  olive6: RadixColors.oliveP3.olive6,
+  olive7: RadixColors.oliveP3.olive7,
+  olive8: RadixColors.oliveP3.olive8,
+  olive9: RadixColors.oliveP3.olive9,
+  olive10: RadixColors.oliveP3.olive10,
+  olive11: RadixColors.oliveP3.olive11,
+  olive12: RadixColors.oliveP3.olive12,
+
+  sand1: RadixColors.sandP3.sand1,
+  sand2: RadixColors.sandP3.sand2,
+  sand3: RadixColors.sandP3.sand3,
+  sand4: RadixColors.sandP3.sand4,
+  sand5: RadixColors.sandP3.sand5,
+  sand6: RadixColors.sandP3.sand6,
+  sand7: RadixColors.sandP3.sand7,
+  sand8: RadixColors.sandP3.sand8,
+  sand9: RadixColors.sandP3.sand9,
+  sand10: RadixColors.sandP3.sand10,
+  sand11: RadixColors.sandP3.sand11,
+  sand12: RadixColors.sandP3.sand12,
+
+  tomato1: RadixColors.tomatoP3.tomato1,
+  tomato2: RadixColors.tomatoP3.tomato2,
+  tomato3: RadixColors.tomatoP3.tomato3,
+  tomato4: RadixColors.tomatoP3.tomato4,
+  tomato5: RadixColors.tomatoP3.tomato5,
+  tomato6: RadixColors.tomatoP3.tomato6,
+  tomato7: RadixColors.tomatoP3.tomato7,
+  tomato8: RadixColors.tomatoP3.tomato8,
+  tomato9: RadixColors.tomatoP3.tomato9,
+  tomato10: RadixColors.tomatoP3.tomato10,
+  tomato11: RadixColors.tomatoP3.tomato11,
+  tomato12: RadixColors.tomatoP3.tomato12,
+
+  ruby1: RadixColors.rubyP3.ruby1,
+  ruby2: RadixColors.rubyP3.ruby2,
+  ruby3: RadixColors.rubyP3.ruby3,
+  ruby4: RadixColors.rubyP3.ruby4,
+  ruby5: RadixColors.rubyP3.ruby5,
+  ruby6: RadixColors.rubyP3.ruby6,
+  ruby7: RadixColors.rubyP3.ruby7,
+  ruby8: RadixColors.rubyP3.ruby8,
+  ruby9: RadixColors.rubyP3.ruby9,
+  ruby10: RadixColors.rubyP3.ruby10,
+  ruby11: RadixColors.rubyP3.ruby11,
+  ruby12: RadixColors.rubyP3.ruby12,
+
+  crimson1: RadixColors.crimsonP3.crimson1,
+  crimson2: RadixColors.crimsonP3.crimson2,
+  crimson3: RadixColors.crimsonP3.crimson3,
+  crimson4: RadixColors.crimsonP3.crimson4,
+  crimson5: RadixColors.crimsonP3.crimson5,
+  crimson6: RadixColors.crimsonP3.crimson6,
+  crimson7: RadixColors.crimsonP3.crimson7,
+  crimson8: RadixColors.crimsonP3.crimson8,
+  crimson9: RadixColors.crimsonP3.crimson9,
+  crimson10: RadixColors.crimsonP3.crimson10,
+  crimson11: RadixColors.crimsonP3.crimson11,
+  crimson12: RadixColors.crimsonP3.crimson12,
+
+  plum1: RadixColors.plumP3.plum1,
+  plum2: RadixColors.plumP3.plum2,
+  plum3: RadixColors.plumP3.plum3,
+  plum4: RadixColors.plumP3.plum4,
+  plum5: RadixColors.plumP3.plum5,
+  plum6: RadixColors.plumP3.plum6,
+  plum7: RadixColors.plumP3.plum7,
+  plum8: RadixColors.plumP3.plum8,
+  plum9: RadixColors.plumP3.plum9,
+  plum10: RadixColors.plumP3.plum10,
+  plum11: RadixColors.plumP3.plum11,
+  plum12: RadixColors.plumP3.plum12,
+
+  violet1: RadixColors.violetP3.violet1,
+  violet2: RadixColors.violetP3.violet2,
+  violet3: RadixColors.violetP3.violet3,
+  violet4: RadixColors.violetP3.violet4,
+  violet5: RadixColors.violetP3.violet5,
+  violet6: RadixColors.violetP3.violet6,
+  violet7: RadixColors.violetP3.violet7,
+  violet8: RadixColors.violetP3.violet8,
+  violet9: RadixColors.violetP3.violet9,
+  violet10: RadixColors.violetP3.violet10,
+  violet11: RadixColors.violetP3.violet11,
+  violet12: RadixColors.violetP3.violet12,
+
+  iris1: RadixColors.irisP3.iris1,
+  iris2: RadixColors.irisP3.iris2,
+  iris3: RadixColors.irisP3.iris3,
+  iris4: RadixColors.irisP3.iris4,
+  iris5: RadixColors.irisP3.iris5,
+  iris6: RadixColors.irisP3.iris6,
+  iris7: RadixColors.irisP3.iris7,
+  iris8: RadixColors.irisP3.iris8,
+  iris9: RadixColors.irisP3.iris9,
+  iris10: RadixColors.irisP3.iris10,
+  iris11: RadixColors.irisP3.iris11,
+  iris12: RadixColors.irisP3.iris12,
+
+  cyan1: RadixColors.cyanP3.cyan1,
+  cyan2: RadixColors.cyanP3.cyan2,
+  cyan3: RadixColors.cyanP3.cyan3,
+  cyan4: RadixColors.cyanP3.cyan4,
+  cyan5: RadixColors.cyanP3.cyan5,
+  cyan6: RadixColors.cyanP3.cyan6,
+  cyan7: RadixColors.cyanP3.cyan7,
+  cyan8: RadixColors.cyanP3.cyan8,
+  cyan9: RadixColors.cyanP3.cyan9,
+  cyan10: RadixColors.cyanP3.cyan10,
+  cyan11: RadixColors.cyanP3.cyan11,
+  cyan12: RadixColors.cyanP3.cyan12,
+
+  jade1: RadixColors.jadeP3.jade1,
+  jade2: RadixColors.jadeP3.jade2,
+  jade3: RadixColors.jadeP3.jade3,
+  jade4: RadixColors.jadeP3.jade4,
+  jade5: RadixColors.jadeP3.jade5,
+  jade6: RadixColors.jadeP3.jade6,
+  jade7: RadixColors.jadeP3.jade7,
+  jade8: RadixColors.jadeP3.jade8,
+  jade9: RadixColors.jadeP3.jade9,
+  jade10: RadixColors.jadeP3.jade10,
+  jade11: RadixColors.jadeP3.jade11,
+  jade12: RadixColors.jadeP3.jade12,
+
+  grass1: RadixColors.grassP3.grass1,
+  grass2: RadixColors.grassP3.grass2,
+  grass3: RadixColors.grassP3.grass3,
+  grass4: RadixColors.grassP3.grass4,
+  grass5: RadixColors.grassP3.grass5,
+  grass6: RadixColors.grassP3.grass6,
+  grass7: RadixColors.grassP3.grass7,
+  grass8: RadixColors.grassP3.grass8,
+  grass9: RadixColors.grassP3.grass9,
+  grass10: RadixColors.grassP3.grass10,
+  grass11: RadixColors.grassP3.grass11,
+  grass12: RadixColors.grassP3.grass12,
+
+  mint1: RadixColors.mintP3.mint1,
+  mint2: RadixColors.mintP3.mint2,
+  mint3: RadixColors.mintP3.mint3,
+  mint4: RadixColors.mintP3.mint4,
+  mint5: RadixColors.mintP3.mint5,
+  mint6: RadixColors.mintP3.mint6,
+  mint7: RadixColors.mintP3.mint7,
+  mint8: RadixColors.mintP3.mint8,
+  mint9: RadixColors.mintP3.mint9,
+  mint10: RadixColors.mintP3.mint10,
+  mint11: RadixColors.mintP3.mint11,
+  mint12: RadixColors.mintP3.mint12,
+
+  lime1: RadixColors.limeP3.lime1,
+  lime2: RadixColors.limeP3.lime2,
+  lime3: RadixColors.limeP3.lime3,
+  lime4: RadixColors.limeP3.lime4,
+  lime5: RadixColors.limeP3.lime5,
+  lime6: RadixColors.limeP3.lime6,
+  lime7: RadixColors.limeP3.lime7,
+  lime8: RadixColors.limeP3.lime8,
+  lime9: RadixColors.limeP3.lime9,
+  lime10: RadixColors.limeP3.lime10,
+  lime11: RadixColors.limeP3.lime11,
+  lime12: RadixColors.limeP3.lime12,
+
+  bronze1: RadixColors.bronzeP3.bronze1,
+  bronze2: RadixColors.bronzeP3.bronze2,
+  bronze3: RadixColors.bronzeP3.bronze3,
+  bronze4: RadixColors.bronzeP3.bronze4,
+  bronze5: RadixColors.bronzeP3.bronze5,
+  bronze6: RadixColors.bronzeP3.bronze6,
+  bronze7: RadixColors.bronzeP3.bronze7,
+  bronze8: RadixColors.bronzeP3.bronze8,
+  bronze9: RadixColors.bronzeP3.bronze9,
+  bronze10: RadixColors.bronzeP3.bronze10,
+  bronze11: RadixColors.bronzeP3.bronze11,
+  bronze12: RadixColors.bronzeP3.bronze12,
+
+  gold1: RadixColors.goldP3.gold1,
+  gold2: RadixColors.goldP3.gold2,
+  gold3: RadixColors.goldP3.gold3,
+  gold4: RadixColors.goldP3.gold4,
+  gold5: RadixColors.goldP3.gold5,
+  gold6: RadixColors.goldP3.gold6,
+  gold7: RadixColors.goldP3.gold7,
+  gold8: RadixColors.goldP3.gold8,
+  gold9: RadixColors.goldP3.gold9,
+  gold10: RadixColors.goldP3.gold10,
+  gold11: RadixColors.goldP3.gold11,
+  gold12: RadixColors.goldP3.gold12,
+
+  brown1: RadixColors.brownP3.brown1,
+  brown2: RadixColors.brownP3.brown2,
+  brown3: RadixColors.brownP3.brown3,
+  brown4: RadixColors.brownP3.brown4,
+  brown5: RadixColors.brownP3.brown5,
+  brown6: RadixColors.brownP3.brown6,
+  brown7: RadixColors.brownP3.brown7,
+  brown8: RadixColors.brownP3.brown8,
+  brown9: RadixColors.brownP3.brown9,
+  brown10: RadixColors.brownP3.brown10,
+  brown11: RadixColors.brownP3.brown11,
+  brown12: RadixColors.brownP3.brown12,
+
+  amber1: RadixColors.amberP3.amber1,
+  amber2: RadixColors.amberP3.amber2,
+  amber3: RadixColors.amberP3.amber3,
+  amber4: RadixColors.amberP3.amber4,
+  amber5: RadixColors.amberP3.amber5,
+  amber6: RadixColors.amberP3.amber6,
+  amber7: RadixColors.amberP3.amber7,
+  amber8: RadixColors.amberP3.amber8,
+  amber9: RadixColors.amberP3.amber9,
+  amber10: RadixColors.amberP3.amber10,
+  amber11: RadixColors.amberP3.amber11,
+  amber12: RadixColors.amberP3.amber12,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/SnackBarDark.ts b/packages/twenty-new-ui/src/theme/constants/SnackBarDark.ts
new file mode 100644
index 00000000000..981a2cb45a0
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/SnackBarDark.ts
@@ -0,0 +1,26 @@
+import { BACKGROUND_DARK } from '@new-ui/theme/constants/BackgroundDark';
+import { FONT_DARK } from '@new-ui/theme/constants/FontDark';
+import { MAIN_COLORS_DARK } from '@new-ui/theme/constants/MainColorsDark';
+
+export const SNACK_BAR_DARK = {
+  success: {
+    color: MAIN_COLORS_DARK.turquoise,
+    backgroundColor: BACKGROUND_DARK.transparent.success,
+  },
+  error: {
+    color: MAIN_COLORS_DARK.red,
+    backgroundColor: BACKGROUND_DARK.transparent.danger,
+  },
+  warning: {
+    color: MAIN_COLORS_DARK.orange,
+    backgroundColor: BACKGROUND_DARK.transparent.orange,
+  },
+  info: {
+    color: MAIN_COLORS_DARK.blue,
+    backgroundColor: BACKGROUND_DARK.transparent.blue,
+  },
+  default: {
+    color: FONT_DARK.color.primary,
+    backgroundColor: BACKGROUND_DARK.transparent.light,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/SnackBarLight.ts b/packages/twenty-new-ui/src/theme/constants/SnackBarLight.ts
new file mode 100644
index 00000000000..1e669e4f6f4
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/SnackBarLight.ts
@@ -0,0 +1,26 @@
+import { BACKGROUND_LIGHT } from '@new-ui/theme/constants/BackgroundLight';
+import { FONT_LIGHT } from '@new-ui/theme/constants/FontLight';
+import { MAIN_COLORS_LIGHT } from '@new-ui/theme/constants/MainColorsLight';
+
+export const SNACK_BAR_LIGHT = {
+  success: {
+    color: MAIN_COLORS_LIGHT.turquoise,
+    backgroundColor: BACKGROUND_LIGHT.transparent.success,
+  },
+  error: {
+    color: MAIN_COLORS_LIGHT.red,
+    backgroundColor: BACKGROUND_LIGHT.transparent.danger,
+  },
+  warning: {
+    color: MAIN_COLORS_LIGHT.orange,
+    backgroundColor: BACKGROUND_LIGHT.transparent.orange,
+  },
+  info: {
+    color: MAIN_COLORS_LIGHT.blue,
+    backgroundColor: BACKGROUND_LIGHT.transparent.blue,
+  },
+  default: {
+    color: FONT_LIGHT.color.primary,
+    backgroundColor: BACKGROUND_LIGHT.transparent.light,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/TagDark.ts b/packages/twenty-new-ui/src/theme/constants/TagDark.ts
new file mode 100644
index 00000000000..7c4f2fe1b55
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/TagDark.ts
@@ -0,0 +1,68 @@
+import { COLOR_DARK } from '@new-ui/theme/constants/ColorsDark';
+
+export const TAG_DARK = {
+  text: {
+    gray: COLOR_DARK.gray11,
+    mauve: COLOR_DARK.mauve11,
+    slate: COLOR_DARK.slate11,
+    sage: COLOR_DARK.sage11,
+    olive: COLOR_DARK.olive11,
+    sand: COLOR_DARK.sand11,
+    tomato: COLOR_DARK.tomato11,
+    red: COLOR_DARK.red11,
+    ruby: COLOR_DARK.ruby11,
+    crimson: COLOR_DARK.crimson11,
+    pink: COLOR_DARK.pink11,
+    plum: COLOR_DARK.plum11,
+    purple: COLOR_DARK.purple11,
+    violet: COLOR_DARK.violet11,
+    iris: COLOR_DARK.iris11,
+    cyan: COLOR_DARK.cyan11,
+    turquoise: COLOR_DARK.turquoise11,
+    sky: COLOR_DARK.sky11,
+    blue: COLOR_DARK.blue11,
+    jade: COLOR_DARK.jade11,
+    green: COLOR_DARK.green11,
+    grass: COLOR_DARK.grass11,
+    mint: COLOR_DARK.mint11,
+    lime: COLOR_DARK.lime11,
+    bronze: COLOR_DARK.bronze11,
+    gold: COLOR_DARK.gold11,
+    brown: COLOR_DARK.brown11,
+    orange: COLOR_DARK.orange11,
+    amber: COLOR_DARK.amber11,
+    yellow: COLOR_DARK.yellow11,
+  },
+  background: {
+    gray: COLOR_DARK.gray3,
+    mauve: COLOR_DARK.mauve3,
+    slate: COLOR_DARK.slate3,
+    sage: COLOR_DARK.sage3,
+    olive: COLOR_DARK.olive3,
+    sand: COLOR_DARK.sand3,
+    tomato: COLOR_DARK.tomato3,
+    red: COLOR_DARK.red3,
+    ruby: COLOR_DARK.ruby3,
+    crimson: COLOR_DARK.crimson3,
+    pink: COLOR_DARK.pink3,
+    plum: COLOR_DARK.plum3,
+    purple: COLOR_DARK.purple3,
+    violet: COLOR_DARK.violet3,
+    iris: COLOR_DARK.iris3,
+    cyan: COLOR_DARK.cyan3,
+    turquoise: COLOR_DARK.turquoise3,
+    sky: COLOR_DARK.sky3,
+    blue: COLOR_DARK.blue3,
+    jade: COLOR_DARK.jade3,
+    green: COLOR_DARK.green3,
+    grass: COLOR_DARK.grass3,
+    mint: COLOR_DARK.mint3,
+    lime: COLOR_DARK.lime3,
+    bronze: COLOR_DARK.bronze3,
+    gold: COLOR_DARK.gold3,
+    brown: COLOR_DARK.brown3,
+    orange: COLOR_DARK.orange3,
+    amber: COLOR_DARK.amber3,
+    yellow: COLOR_DARK.yellow3,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/TagLight.ts b/packages/twenty-new-ui/src/theme/constants/TagLight.ts
new file mode 100644
index 00000000000..0b450a81516
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/TagLight.ts
@@ -0,0 +1,68 @@
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+
+export const TAG_LIGHT = {
+  text: {
+    gray: COLOR_LIGHT.gray11,
+    mauve: COLOR_LIGHT.mauve11,
+    slate: COLOR_LIGHT.slate11,
+    sage: COLOR_LIGHT.sage11,
+    olive: COLOR_LIGHT.olive11,
+    sand: COLOR_LIGHT.sand11,
+    tomato: COLOR_LIGHT.tomato11,
+    red: COLOR_LIGHT.red11,
+    ruby: COLOR_LIGHT.ruby11,
+    crimson: COLOR_LIGHT.crimson11,
+    pink: COLOR_LIGHT.pink11,
+    plum: COLOR_LIGHT.plum11,
+    purple: COLOR_LIGHT.purple11,
+    violet: COLOR_LIGHT.violet11,
+    iris: COLOR_LIGHT.iris11,
+    cyan: COLOR_LIGHT.cyan11,
+    turquoise: COLOR_LIGHT.turquoise11,
+    sky: COLOR_LIGHT.sky11,
+    blue: COLOR_LIGHT.blue11,
+    jade: COLOR_LIGHT.jade11,
+    green: COLOR_LIGHT.green11,
+    grass: COLOR_LIGHT.grass11,
+    mint: COLOR_LIGHT.mint11,
+    lime: COLOR_LIGHT.lime11,
+    bronze: COLOR_LIGHT.bronze11,
+    gold: COLOR_LIGHT.gold11,
+    brown: COLOR_LIGHT.brown11,
+    orange: COLOR_LIGHT.orange11,
+    amber: COLOR_LIGHT.amber11,
+    yellow: COLOR_LIGHT.yellow11,
+  },
+  background: {
+    gray: COLOR_LIGHT.gray3,
+    mauve: COLOR_LIGHT.mauve3,
+    slate: COLOR_LIGHT.slate3,
+    sage: COLOR_LIGHT.sage3,
+    olive: COLOR_LIGHT.olive3,
+    sand: COLOR_LIGHT.sand3,
+    tomato: COLOR_LIGHT.tomato3,
+    red: COLOR_LIGHT.red3,
+    ruby: COLOR_LIGHT.ruby3,
+    crimson: COLOR_LIGHT.crimson3,
+    pink: COLOR_LIGHT.pink3,
+    plum: COLOR_LIGHT.plum3,
+    purple: COLOR_LIGHT.purple3,
+    violet: COLOR_LIGHT.violet3,
+    iris: COLOR_LIGHT.iris3,
+    cyan: COLOR_LIGHT.cyan3,
+    turquoise: COLOR_LIGHT.turquoise3,
+    sky: COLOR_LIGHT.sky3,
+    blue: COLOR_LIGHT.blue3,
+    jade: COLOR_LIGHT.jade3,
+    green: COLOR_LIGHT.green3,
+    grass: COLOR_LIGHT.grass3,
+    mint: COLOR_LIGHT.mint3,
+    lime: COLOR_LIGHT.lime3,
+    bronze: COLOR_LIGHT.bronze3,
+    gold: COLOR_LIGHT.gold3,
+    brown: COLOR_LIGHT.brown3,
+    orange: COLOR_LIGHT.orange3,
+    amber: COLOR_LIGHT.amber3,
+    yellow: COLOR_LIGHT.yellow3,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/Text.ts b/packages/twenty-new-ui/src/theme/constants/Text.ts
new file mode 100644
index 00000000000..f194a478115
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/Text.ts
@@ -0,0 +1,13 @@
+export const TEXT = {
+  lineHeight: {
+    lg: 1.5,
+    md: 1.1,
+  },
+
+  iconSizeMedium: 16,
+  iconSizeSmall: 14,
+
+  iconStrikeLight: 1.6,
+  iconStrikeMedium: 2,
+  iconStrikeBold: 2.5,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/ThemeCommon.ts b/packages/twenty-new-ui/src/theme/constants/ThemeCommon.ts
new file mode 100644
index 00000000000..60f7dc28e53
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/ThemeCommon.ts
@@ -0,0 +1,27 @@
+import { ACCENT_DARK } from '@new-ui/theme/constants/AccentDark';
+import { ANIMATION } from './Animation';
+import { ICON } from './Icon';
+import { MODAL } from './Modal';
+import { TEXT } from './Text';
+
+export const THEME_COMMON = {
+  icon: ICON,
+  modal: MODAL,
+  text: TEXT,
+  animation: ANIMATION,
+  spacingMultiplicator: 4,
+  spacing: (...args: number[]) =>
+    args.map((multiplicator) => `${multiplicator * 4}px`).join(' '),
+  betweenSiblingsGap: `2px`,
+  table: {
+    horizontalCellMargin: '8px',
+    checkboxColumnWidth: '32px',
+    horizontalCellPadding: '8px',
+  },
+  sidePanelWidth: '500px',
+  clickableElementBackgroundTransition: 'background 0.1s ease',
+  lastLayerZIndex: 2147483647,
+  buttons: {
+    secondaryTextColor: ACCENT_DARK.accent11,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/ThemeDark.ts b/packages/twenty-new-ui/src/theme/constants/ThemeDark.ts
new file mode 100644
index 00000000000..385c63ddde6
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/ThemeDark.ts
@@ -0,0 +1,33 @@
+import { BLUR_DARK } from '@new-ui/theme/constants/BlurDark';
+import { ILLUSTRATION_ICON_DARK } from '@new-ui/theme/constants/IllustrationIconDark';
+import { COLOR_DARK } from './ColorsDark';
+import { GRAY_SCALE_DARK } from './GrayScaleDark';
+import { SNACK_BAR_DARK } from './SnackBarDark';
+import { ACCENT_DARK } from './AccentDark';
+import { BACKGROUND_DARK } from './BackgroundDark';
+import { BORDER_DARK } from './BorderDark';
+import { BOX_SHADOW_DARK } from './BoxShadowDark';
+import { CODE_DARK } from './CodeDark';
+import { FONT_DARK } from './FontDark';
+import { TAG_DARK } from './TagDark';
+import { THEME_COMMON } from './ThemeCommon';
+import type { THEME_LIGHT } from './ThemeLight';
+
+export const THEME_DARK: typeof THEME_LIGHT = {
+  ...THEME_COMMON,
+  ...{
+    accent: ACCENT_DARK,
+    background: BACKGROUND_DARK,
+    blur: BLUR_DARK,
+    border: BORDER_DARK,
+    boxShadow: BOX_SHADOW_DARK,
+    font: FONT_DARK,
+    name: 'dark',
+    snackBar: SNACK_BAR_DARK,
+    tag: TAG_DARK,
+    code: CODE_DARK,
+    IllustrationIcon: ILLUSTRATION_ICON_DARK,
+    grayScale: GRAY_SCALE_DARK,
+    color: COLOR_DARK,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/ThemeLight.ts b/packages/twenty-new-ui/src/theme/constants/ThemeLight.ts
new file mode 100644
index 00000000000..1968e514b28
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/ThemeLight.ts
@@ -0,0 +1,32 @@
+import { BLUR_LIGHT } from '@new-ui/theme/constants/BlurLight';
+import { COLOR_LIGHT } from '@new-ui/theme/constants/ColorsLight';
+import { GRAY_SCALE_LIGHT } from '@new-ui/theme/constants/GrayScaleLight';
+import { ILLUSTRATION_ICON_LIGHT } from '@new-ui/theme/constants/IllustrationIconLight';
+import { SNACK_BAR_LIGHT } from '@new-ui/theme/constants/SnackBarLight';
+import { ACCENT_LIGHT } from './AccentLight';
+import { BACKGROUND_LIGHT } from './BackgroundLight';
+import { BORDER_LIGHT } from './BorderLight';
+import { BOX_SHADOW_LIGHT } from './BoxShadowLight';
+import { CODE_LIGHT } from './CodeLight';
+import { FONT_LIGHT } from './FontLight';
+import { TAG_LIGHT } from './TagLight';
+import { THEME_COMMON } from './ThemeCommon';
+
+export const THEME_LIGHT = {
+  ...THEME_COMMON,
+  ...{
+    accent: ACCENT_LIGHT,
+    background: BACKGROUND_LIGHT,
+    blur: BLUR_LIGHT,
+    border: BORDER_LIGHT,
+    boxShadow: BOX_SHADOW_LIGHT,
+    font: FONT_LIGHT,
+    name: 'light',
+    snackBar: SNACK_BAR_LIGHT,
+    tag: TAG_LIGHT,
+    code: CODE_LIGHT,
+    IllustrationIcon: ILLUSTRATION_ICON_LIGHT,
+    grayScale: GRAY_SCALE_LIGHT,
+    color: COLOR_LIGHT,
+  },
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/TransparentColorsDark.ts b/packages/twenty-new-ui/src/theme/constants/TransparentColorsDark.ts
new file mode 100644
index 00000000000..dad6596485a
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/TransparentColorsDark.ts
@@ -0,0 +1,394 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_DARK_ALPHA } from '@new-ui/theme/constants/GrayScaleDarkAlpha';
+
+export const TRANSPARENT_COLORS_DARK = {
+  green1: RadixColors.greenDarkA.greenA1,
+  green2: RadixColors.greenDarkA.greenA2,
+  green3: RadixColors.greenDarkA.greenA3,
+  green4: RadixColors.greenDarkA.greenA4,
+  green5: RadixColors.greenDarkA.greenA5,
+  green6: RadixColors.greenDarkA.greenA6,
+  green7: RadixColors.greenDarkA.greenA7,
+  green8: RadixColors.greenDarkA.greenA8,
+  green9: RadixColors.greenDarkA.greenA9,
+  green10: RadixColors.greenDarkA.greenA10,
+  green11: RadixColors.greenDarkA.greenA11,
+  green12: RadixColors.greenDarkA.greenA12,
+
+  turquoise1: RadixColors.tealDarkA.tealA1,
+  turquoise2: RadixColors.tealDarkA.tealA2,
+  turquoise3: RadixColors.tealDarkA.tealA3,
+  turquoise4: RadixColors.tealDarkA.tealA4,
+  turquoise5: RadixColors.tealDarkA.tealA5,
+  turquoise6: RadixColors.tealDarkA.tealA6,
+  turquoise7: RadixColors.tealDarkA.tealA7,
+  turquoise8: RadixColors.tealDarkA.tealA8,
+  turquoise9: RadixColors.tealDarkA.tealA9,
+  turquoise10: RadixColors.tealDarkA.tealA10,
+  turquoise11: RadixColors.tealDarkA.tealA11,
+  turquoise12: RadixColors.tealDarkA.tealA12,
+
+  sky1: RadixColors.skyDarkA.skyA1,
+  sky2: RadixColors.skyDarkA.skyA2,
+  sky3: RadixColors.skyDarkA.skyA3,
+  sky4: RadixColors.skyDarkA.skyA4,
+  sky5: RadixColors.skyDarkA.skyA5,
+  sky6: RadixColors.skyDarkA.skyA6,
+  sky7: RadixColors.skyDarkA.skyA7,
+  sky8: RadixColors.skyDarkA.skyA8,
+  sky9: RadixColors.skyDarkA.skyA9,
+  sky10: RadixColors.skyDarkA.skyA10,
+  sky11: RadixColors.skyDarkA.skyA11,
+  sky12: RadixColors.skyDarkA.skyA12,
+
+  blue1: RadixColors.indigoDarkA.indigoA1,
+  blue2: RadixColors.indigoDarkA.indigoA2,
+  blue3: RadixColors.indigoDarkA.indigoA3,
+  blue4: RadixColors.indigoDarkA.indigoA4,
+  blue5: RadixColors.indigoDarkA.indigoA5,
+  blue6: RadixColors.indigoDarkA.indigoA6,
+  blue7: RadixColors.indigoDarkA.indigoA7,
+  blue8: RadixColors.indigoDarkA.indigoA8,
+  blue9: RadixColors.indigoDarkA.indigoA9,
+  blue10: RadixColors.indigoDarkA.indigoA10,
+  blue11: RadixColors.indigoDarkA.indigoA11,
+  blue12: RadixColors.indigoDarkA.indigoA12,
+
+  purple1: RadixColors.purpleDarkA.purpleA1,
+  purple2: RadixColors.purpleDarkA.purpleA2,
+  purple3: RadixColors.purpleDarkA.purpleA3,
+  purple4: RadixColors.purpleDarkA.purpleA4,
+  purple5: RadixColors.purpleDarkA.purpleA5,
+  purple6: RadixColors.purpleDarkA.purpleA6,
+  purple7: RadixColors.purpleDarkA.purpleA7,
+  purple8: RadixColors.purpleDarkA.purpleA8,
+  purple9: RadixColors.purpleDarkA.purpleA9,
+  purple10: RadixColors.purpleDarkA.purpleA10,
+  purple11: RadixColors.purpleDarkA.purpleA11,
+  purple12: RadixColors.purpleDarkA.purpleA12,
+
+  pink1: RadixColors.pinkDarkA.pinkA1,
+  pink2: RadixColors.pinkDarkA.pinkA2,
+  pink3: RadixColors.pinkDarkA.pinkA3,
+  pink4: RadixColors.pinkDarkA.pinkA4,
+  pink5: RadixColors.pinkDarkA.pinkA5,
+  pink6: RadixColors.pinkDarkA.pinkA6,
+  pink7: RadixColors.pinkDarkA.pinkA7,
+  pink8: RadixColors.pinkDarkA.pinkA8,
+  pink9: RadixColors.pinkDarkA.pinkA9,
+  pink10: RadixColors.pinkDarkA.pinkA10,
+  pink11: RadixColors.pinkDarkA.pinkA11,
+  pink12: RadixColors.pinkDarkA.pinkA12,
+
+  red1: RadixColors.redDarkA.redA1,
+  red2: RadixColors.redDarkA.redA2,
+  red3: RadixColors.redDarkA.redA3,
+  red4: RadixColors.redDarkA.redA4,
+  red5: RadixColors.redDarkA.redA5,
+  red6: RadixColors.redDarkA.redA6,
+  red7: RadixColors.redDarkA.redA7,
+  red8: RadixColors.redDarkA.redA8,
+  red9: RadixColors.redDarkA.redA9,
+  red10: RadixColors.redDarkA.redA10,
+  red11: RadixColors.redDarkA.redA11,
+  red12: RadixColors.redDarkA.redA12,
+
+  orange1: RadixColors.orangeDarkA.orangeA1,
+  orange2: RadixColors.orangeDarkA.orangeA2,
+  orange3: RadixColors.orangeDarkA.orangeA3,
+  orange4: RadixColors.orangeDarkA.orangeA4,
+  orange5: RadixColors.orangeDarkA.orangeA5,
+  orange6: RadixColors.orangeDarkA.orangeA6,
+  orange7: RadixColors.orangeDarkA.orangeA7,
+  orange8: RadixColors.orangeDarkA.orangeA8,
+  orange9: RadixColors.orangeDarkA.orangeA9,
+  orange10: RadixColors.orangeDarkA.orangeA10,
+  orange11: RadixColors.orangeDarkA.orangeA11,
+  orange12: RadixColors.orangeDarkA.orangeA12,
+
+  yellow1: RadixColors.yellowDarkA.yellowA1,
+  yellow2: RadixColors.yellowDarkA.yellowA2,
+  yellow3: RadixColors.yellowDarkA.yellowA3,
+  yellow4: RadixColors.yellowDarkA.yellowA4,
+  yellow5: RadixColors.yellowDarkA.yellowA5,
+  yellow6: RadixColors.yellowDarkA.yellowA6,
+  yellow7: RadixColors.yellowDarkA.yellowA7,
+  yellow8: RadixColors.yellowDarkA.yellowA8,
+  yellow9: RadixColors.yellowDarkA.yellowA9,
+  yellow10: RadixColors.yellowDarkA.yellowA10,
+  yellow11: RadixColors.yellowDarkA.yellowA11,
+  yellow12: RadixColors.yellowDarkA.yellowA12,
+
+  gray1: GRAY_SCALE_DARK_ALPHA.gray1,
+  gray2: GRAY_SCALE_DARK_ALPHA.gray2,
+  gray3: GRAY_SCALE_DARK_ALPHA.gray3,
+  gray4: GRAY_SCALE_DARK_ALPHA.gray4,
+  gray5: GRAY_SCALE_DARK_ALPHA.gray5,
+  gray6: GRAY_SCALE_DARK_ALPHA.gray6,
+  gray7: GRAY_SCALE_DARK_ALPHA.gray7,
+  gray8: GRAY_SCALE_DARK_ALPHA.gray8,
+  gray9: GRAY_SCALE_DARK_ALPHA.gray9,
+  gray10: GRAY_SCALE_DARK_ALPHA.gray10,
+  gray11: GRAY_SCALE_DARK_ALPHA.gray11,
+  gray12: GRAY_SCALE_DARK_ALPHA.gray12,
+
+  mauve1: RadixColors.mauveDarkA.mauveA1,
+  mauve2: RadixColors.mauveDarkA.mauveA2,
+  mauve3: RadixColors.mauveDarkA.mauveA3,
+  mauve4: RadixColors.mauveDarkA.mauveA4,
+  mauve5: RadixColors.mauveDarkA.mauveA5,
+  mauve6: RadixColors.mauveDarkA.mauveA6,
+  mauve7: RadixColors.mauveDarkA.mauveA7,
+  mauve8: RadixColors.mauveDarkA.mauveA8,
+  mauve9: RadixColors.mauveDarkA.mauveA9,
+  mauve10: RadixColors.mauveDarkA.mauveA10,
+  mauve11: RadixColors.mauveDarkA.mauveA11,
+  mauve12: RadixColors.mauveDarkA.mauveA12,
+
+  slate1: RadixColors.slateDarkA.slateA1,
+  slate2: RadixColors.slateDarkA.slateA2,
+  slate3: RadixColors.slateDarkA.slateA3,
+  slate4: RadixColors.slateDarkA.slateA4,
+  slate5: RadixColors.slateDarkA.slateA5,
+  slate6: RadixColors.slateDarkA.slateA6,
+  slate7: RadixColors.slateDarkA.slateA7,
+  slate8: RadixColors.slateDarkA.slateA8,
+  slate9: RadixColors.slateDarkA.slateA9,
+  slate10: RadixColors.slateDarkA.slateA10,
+  slate11: RadixColors.slateDarkA.slateA11,
+  slate12: RadixColors.slateDarkA.slateA12,
+
+  sage1: RadixColors.sageDarkA.sageA1,
+  sage2: RadixColors.sageDarkA.sageA2,
+  sage3: RadixColors.sageDarkA.sageA3,
+  sage4: RadixColors.sageDarkA.sageA4,
+  sage5: RadixColors.sageDarkA.sageA5,
+  sage6: RadixColors.sageDarkA.sageA6,
+  sage7: RadixColors.sageDarkA.sageA7,
+  sage8: RadixColors.sageDarkA.sageA8,
+  sage9: RadixColors.sageDarkA.sageA9,
+  sage10: RadixColors.sageDarkA.sageA10,
+  sage11: RadixColors.sageDarkA.sageA11,
+  sage12: RadixColors.sageDarkA.sageA12,
+
+  olive1: RadixColors.oliveDarkA.oliveA1,
+  olive2: RadixColors.oliveDarkA.oliveA2,
+  olive3: RadixColors.oliveDarkA.oliveA3,
+  olive4: RadixColors.oliveDarkA.oliveA4,
+  olive5: RadixColors.oliveDarkA.oliveA5,
+  olive6: RadixColors.oliveDarkA.oliveA6,
+  olive7: RadixColors.oliveDarkA.oliveA7,
+  olive8: RadixColors.oliveDarkA.oliveA8,
+  olive9: RadixColors.oliveDarkA.oliveA9,
+  olive10: RadixColors.oliveDarkA.oliveA10,
+  olive11: RadixColors.oliveDarkA.oliveA11,
+  olive12: RadixColors.oliveDarkA.oliveA12,
+
+  sand1: RadixColors.sandDarkA.sandA1,
+  sand2: RadixColors.sandDarkA.sandA2,
+  sand3: RadixColors.sandDarkA.sandA3,
+  sand4: RadixColors.sandDarkA.sandA4,
+  sand5: RadixColors.sandDarkA.sandA5,
+  sand6: RadixColors.sandDarkA.sandA6,
+  sand7: RadixColors.sandDarkA.sandA7,
+  sand8: RadixColors.sandDarkA.sandA8,
+  sand9: RadixColors.sandDarkA.sandA9,
+  sand10: RadixColors.sandDarkA.sandA10,
+  sand11: RadixColors.sandDarkA.sandA11,
+  sand12: RadixColors.sandDarkA.sandA12,
+
+  tomato1: RadixColors.tomatoDarkA.tomatoA1,
+  tomato2: RadixColors.tomatoDarkA.tomatoA2,
+  tomato3: RadixColors.tomatoDarkA.tomatoA3,
+  tomato4: RadixColors.tomatoDarkA.tomatoA4,
+  tomato5: RadixColors.tomatoDarkA.tomatoA5,
+  tomato6: RadixColors.tomatoDarkA.tomatoA6,
+  tomato7: RadixColors.tomatoDarkA.tomatoA7,
+  tomato8: RadixColors.tomatoDarkA.tomatoA8,
+  tomato9: RadixColors.tomatoDarkA.tomatoA9,
+  tomato10: RadixColors.tomatoDarkA.tomatoA10,
+  tomato11: RadixColors.tomatoDarkA.tomatoA11,
+  tomato12: RadixColors.tomatoDarkA.tomatoA12,
+
+  ruby1: RadixColors.rubyDarkA.rubyA1,
+  ruby2: RadixColors.rubyDarkA.rubyA2,
+  ruby3: RadixColors.rubyDarkA.rubyA3,
+  ruby4: RadixColors.rubyDarkA.rubyA4,
+  ruby5: RadixColors.rubyDarkA.rubyA5,
+  ruby6: RadixColors.rubyDarkA.rubyA6,
+  ruby7: RadixColors.rubyDarkA.rubyA7,
+  ruby8: RadixColors.rubyDarkA.rubyA8,
+  ruby9: RadixColors.rubyDarkA.rubyA9,
+  ruby10: RadixColors.rubyDarkA.rubyA10,
+  ruby11: RadixColors.rubyDarkA.rubyA11,
+  ruby12: RadixColors.rubyDarkA.rubyA12,
+
+  crimson1: RadixColors.crimsonDarkA.crimsonA1,
+  crimson2: RadixColors.crimsonDarkA.crimsonA2,
+  crimson3: RadixColors.crimsonDarkA.crimsonA3,
+  crimson4: RadixColors.crimsonDarkA.crimsonA4,
+  crimson5: RadixColors.crimsonDarkA.crimsonA5,
+  crimson6: RadixColors.crimsonDarkA.crimsonA6,
+  crimson7: RadixColors.crimsonDarkA.crimsonA7,
+  crimson8: RadixColors.crimsonDarkA.crimsonA8,
+  crimson9: RadixColors.crimsonDarkA.crimsonA9,
+  crimson10: RadixColors.crimsonDarkA.crimsonA10,
+  crimson11: RadixColors.crimsonDarkA.crimsonA11,
+  crimson12: RadixColors.crimsonDarkA.crimsonA12,
+
+  plum1: RadixColors.plumDarkA.plumA1,
+  plum2: RadixColors.plumDarkA.plumA2,
+  plum3: RadixColors.plumDarkA.plumA3,
+  plum4: RadixColors.plumDarkA.plumA4,
+  plum5: RadixColors.plumDarkA.plumA5,
+  plum6: RadixColors.plumDarkA.plumA6,
+  plum7: RadixColors.plumDarkA.plumA7,
+  plum8: RadixColors.plumDarkA.plumA8,
+  plum9: RadixColors.plumDarkA.plumA9,
+  plum10: RadixColors.plumDarkA.plumA10,
+  plum11: RadixColors.plumDarkA.plumA11,
+  plum12: RadixColors.plumDarkA.plumA12,
+
+  violet1: RadixColors.violetDarkA.violetA1,
+  violet2: RadixColors.violetDarkA.violetA2,
+  violet3: RadixColors.violetDarkA.violetA3,
+  violet4: RadixColors.violetDarkA.violetA4,
+  violet5: RadixColors.violetDarkA.violetA5,
+  violet6: RadixColors.violetDarkA.violetA6,
+  violet7: RadixColors.violetDarkA.violetA7,
+  violet8: RadixColors.violetDarkA.violetA8,
+  violet9: RadixColors.violetDarkA.violetA9,
+  violet10: RadixColors.violetDarkA.violetA10,
+  violet11: RadixColors.violetDarkA.violetA11,
+  violet12: RadixColors.violetDarkA.violetA12,
+
+  iris1: RadixColors.irisDarkA.irisA1,
+  iris2: RadixColors.irisDarkA.irisA2,
+  iris3: RadixColors.irisDarkA.irisA3,
+  iris4: RadixColors.irisDarkA.irisA4,
+  iris5: RadixColors.irisDarkA.irisA5,
+  iris6: RadixColors.irisDarkA.irisA6,
+  iris7: RadixColors.irisDarkA.irisA7,
+  iris8: RadixColors.irisDarkA.irisA8,
+  iris9: RadixColors.irisDarkA.irisA9,
+  iris10: RadixColors.irisDarkA.irisA10,
+  iris11: RadixColors.irisDarkA.irisA11,
+  iris12: RadixColors.irisDarkA.irisA12,
+
+  cyan1: RadixColors.cyanDarkA.cyanA1,
+  cyan2: RadixColors.cyanDarkA.cyanA2,
+  cyan3: RadixColors.cyanDarkA.cyanA3,
+  cyan4: RadixColors.cyanDarkA.cyanA4,
+  cyan5: RadixColors.cyanDarkA.cyanA5,
+  cyan6: RadixColors.cyanDarkA.cyanA6,
+  cyan7: RadixColors.cyanDarkA.cyanA7,
+  cyan8: RadixColors.cyanDarkA.cyanA8,
+  cyan9: RadixColors.cyanDarkA.cyanA9,
+  cyan10: RadixColors.cyanDarkA.cyanA10,
+  cyan11: RadixColors.cyanDarkA.cyanA11,
+  cyan12: RadixColors.cyanDarkA.cyanA12,
+
+  jade1: RadixColors.jadeDarkA.jadeA1,
+  jade2: RadixColors.jadeDarkA.jadeA2,
+  jade3: RadixColors.jadeDarkA.jadeA3,
+  jade4: RadixColors.jadeDarkA.jadeA4,
+  jade5: RadixColors.jadeDarkA.jadeA5,
+  jade6: RadixColors.jadeDarkA.jadeA6,
+  jade7: RadixColors.jadeDarkA.jadeA7,
+  jade8: RadixColors.jadeDarkA.jadeA8,
+  jade9: RadixColors.jadeDarkA.jadeA9,
+  jade10: RadixColors.jadeDarkA.jadeA10,
+  jade11: RadixColors.jadeDarkA.jadeA11,
+  jade12: RadixColors.jadeDarkA.jadeA12,
+
+  grass1: RadixColors.grassDarkA.grassA1,
+  grass2: RadixColors.grassDarkA.grassA2,
+  grass3: RadixColors.grassDarkA.grassA3,
+  grass4: RadixColors.grassDarkA.grassA4,
+  grass5: RadixColors.grassDarkA.grassA5,
+  grass6: RadixColors.grassDarkA.grassA6,
+  grass7: RadixColors.grassDarkA.grassA7,
+  grass8: RadixColors.grassDarkA.grassA8,
+  grass9: RadixColors.grassDarkA.grassA9,
+  grass10: RadixColors.grassDarkA.grassA10,
+  grass11: RadixColors.grassDarkA.grassA11,
+  grass12: RadixColors.grassDarkA.grassA12,
+
+  mint1: RadixColors.mintDarkA.mintA1,
+  mint2: RadixColors.mintDarkA.mintA2,
+  mint3: RadixColors.mintDarkA.mintA3,
+  mint4: RadixColors.mintDarkA.mintA4,
+  mint5: RadixColors.mintDarkA.mintA5,
+  mint6: RadixColors.mintDarkA.mintA6,
+  mint7: RadixColors.mintDarkA.mintA7,
+  mint8: RadixColors.mintDarkA.mintA8,
+  mint9: RadixColors.mintDarkA.mintA9,
+  mint10: RadixColors.mintDarkA.mintA10,
+  mint11: RadixColors.mintDarkA.mintA11,
+  mint12: RadixColors.mintDarkA.mintA12,
+
+  lime1: RadixColors.limeDarkA.limeA1,
+  lime2: RadixColors.limeDarkA.limeA2,
+  lime3: RadixColors.limeDarkA.limeA3,
+  lime4: RadixColors.limeDarkA.limeA4,
+  lime5: RadixColors.limeDarkA.limeA5,
+  lime6: RadixColors.limeDarkA.limeA6,
+  lime7: RadixColors.limeDarkA.limeA7,
+  lime8: RadixColors.limeDarkA.limeA8,
+  lime9: RadixColors.limeDarkA.limeA9,
+  lime10: RadixColors.limeDarkA.limeA10,
+  lime11: RadixColors.limeDarkA.limeA11,
+  lime12: RadixColors.limeDarkA.limeA12,
+
+  bronze1: RadixColors.bronzeDarkA.bronzeA1,
+  bronze2: RadixColors.bronzeDarkA.bronzeA2,
+  bronze3: RadixColors.bronzeDarkA.bronzeA3,
+  bronze4: RadixColors.bronzeDarkA.bronzeA4,
+  bronze5: RadixColors.bronzeDarkA.bronzeA5,
+  bronze6: RadixColors.bronzeDarkA.bronzeA6,
+  bronze7: RadixColors.bronzeDarkA.bronzeA7,
+  bronze8: RadixColors.bronzeDarkA.bronzeA8,
+  bronze9: RadixColors.bronzeDarkA.bronzeA9,
+  bronze10: RadixColors.bronzeDarkA.bronzeA10,
+  bronze11: RadixColors.bronzeDarkA.bronzeA11,
+  bronze12: RadixColors.bronzeDarkA.bronzeA12,
+
+  gold1: RadixColors.goldDarkA.goldA1,
+  gold2: RadixColors.goldDarkA.goldA2,
+  gold3: RadixColors.goldDarkA.goldA3,
+  gold4: RadixColors.goldDarkA.goldA4,
+  gold5: RadixColors.goldDarkA.goldA5,
+  gold6: RadixColors.goldDarkA.goldA6,
+  gold7: RadixColors.goldDarkA.goldA7,
+  gold8: RadixColors.goldDarkA.goldA8,
+  gold9: RadixColors.goldDarkA.goldA9,
+  gold10: RadixColors.goldDarkA.goldA10,
+  gold11: RadixColors.goldDarkA.goldA11,
+  gold12: RadixColors.goldDarkA.goldA12,
+
+  brown1: RadixColors.brownDarkA.brownA1,
+  brown2: RadixColors.brownDarkA.brownA2,
+  brown3: RadixColors.brownDarkA.brownA3,
+  brown4: RadixColors.brownDarkA.brownA4,
+  brown5: RadixColors.brownDarkA.brownA5,
+  brown6: RadixColors.brownDarkA.brownA6,
+  brown7: RadixColors.brownDarkA.brownA7,
+  brown8: RadixColors.brownDarkA.brownA8,
+  brown9: RadixColors.brownDarkA.brownA9,
+  brown10: RadixColors.brownDarkA.brownA10,
+  brown11: RadixColors.brownDarkA.brownA11,
+  brown12: RadixColors.brownDarkA.brownA12,
+
+  amber1: RadixColors.amberDarkA.amberA1,
+  amber2: RadixColors.amberDarkA.amberA2,
+  amber3: RadixColors.amberDarkA.amberA3,
+  amber4: RadixColors.amberDarkA.amberA4,
+  amber5: RadixColors.amberDarkA.amberA5,
+  amber6: RadixColors.amberDarkA.amberA6,
+  amber7: RadixColors.amberDarkA.amberA7,
+  amber8: RadixColors.amberDarkA.amberA8,
+  amber9: RadixColors.amberDarkA.amberA9,
+  amber10: RadixColors.amberDarkA.amberA10,
+  amber11: RadixColors.amberDarkA.amberA11,
+  amber12: RadixColors.amberDarkA.amberA12,
+};
diff --git a/packages/twenty-new-ui/src/theme/constants/TransparentColorsLight.ts b/packages/twenty-new-ui/src/theme/constants/TransparentColorsLight.ts
new file mode 100644
index 00000000000..93de4854534
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/constants/TransparentColorsLight.ts
@@ -0,0 +1,394 @@
+import * as RadixColors from '@radix-ui/colors';
+import { GRAY_SCALE_LIGHT_ALPHA } from '@new-ui/theme/constants/GrayScaleLightAlpha';
+
+export const TRANSPARENT_COLORS_LIGHT = {
+  green1: RadixColors.greenA.greenA1,
+  green2: RadixColors.greenA.greenA2,
+  green3: RadixColors.greenA.greenA3,
+  green4: RadixColors.greenA.greenA4,
+  green5: RadixColors.greenA.greenA5,
+  green6: RadixColors.greenA.greenA6,
+  green7: RadixColors.greenA.greenA7,
+  green8: RadixColors.greenA.greenA8,
+  green9: RadixColors.greenA.greenA9,
+  green10: RadixColors.greenA.greenA10,
+  green11: RadixColors.greenA.greenA11,
+  green12: RadixColors.greenA.greenA12,
+
+  turquoise1: RadixColors.tealA.tealA1,
+  turquoise2: RadixColors.tealA.tealA2,
+  turquoise3: RadixColors.tealA.tealA3,
+  turquoise4: RadixColors.tealA.tealA4,
+  turquoise5: RadixColors.tealA.tealA5,
+  turquoise6: RadixColors.tealA.tealA6,
+  turquoise7: RadixColors.tealA.tealA7,
+  turquoise8: RadixColors.tealA.tealA8,
+  turquoise9: RadixColors.tealA.tealA9,
+  turquoise10: RadixColors.tealA.tealA10,
+  turquoise11: RadixColors.tealA.tealA11,
+  turquoise12: RadixColors.tealA.tealA12,
+
+  sky1: RadixColors.skyA.skyA1,
+  sky2: RadixColors.skyA.skyA2,
+  sky3: RadixColors.skyA.skyA3,
+  sky4: RadixColors.skyA.skyA4,
+  sky5: RadixColors.skyA.skyA5,
+  sky6: RadixColors.skyA.skyA6,
+  sky7: RadixColors.skyA.skyA7,
+  sky8: RadixColors.skyA.skyA8,
+  sky9: RadixColors.skyA.skyA9,
+  sky10: RadixColors.skyA.skyA10,
+  sky11: RadixColors.skyA.skyA11,
+  sky12: RadixColors.skyA.skyA12,
+
+  blue1: RadixColors.indigoA.indigoA1,
+  blue2: RadixColors.indigoA.indigoA2,
+  blue3: RadixColors.indigoA.indigoA3,
+  blue4: RadixColors.indigoA.indigoA4,
+  blue5: RadixColors.indigoA.indigoA5,
+  blue6: RadixColors.indigoA.indigoA6,
+  blue7: RadixColors.indigoA.indigoA7,
+  blue8: RadixColors.indigoA.indigoA8,
+  blue9: RadixColors.indigoA.indigoA9,
+  blue10: RadixColors.indigoA.indigoA10,
+  blue11: RadixColors.indigoA.indigoA11,
+  blue12: RadixColors.indigoA.indigoA12,
+
+  purple1: RadixColors.purpleA.purpleA1,
+  purple2: RadixColors.purpleA.purpleA2,
+  purple3: RadixColors.purpleA.purpleA3,
+  purple4: RadixColors.purpleA.purpleA4,
+  purple5: RadixColors.purpleA.purpleA5,
+  purple6: RadixColors.purpleA.purpleA6,
+  purple7: RadixColors.purpleA.purpleA7,
+  purple8: RadixColors.purpleA.purpleA8,
+  purple9: RadixColors.purpleA.purpleA9,
+  purple10: RadixColors.purpleA.purpleA10,
+  purple11: RadixColors.purpleA.purpleA11,
+  purple12: RadixColors.purpleA.purpleA12,
+
+  pink1: RadixColors.pinkA.pinkA1,
+  pink2: RadixColors.pinkA.pinkA2,
+  pink3: RadixColors.pinkA.pinkA3,
+  pink4: RadixColors.pinkA.pinkA4,
+  pink5: RadixColors.pinkA.pinkA5,
+  pink6: RadixColors.pinkA.pinkA6,
+  pink7: RadixColors.pinkA.pinkA7,
+  pink8: RadixColors.pinkA.pinkA8,
+  pink9: RadixColors.pinkA.pinkA9,
+  pink10: RadixColors.pinkA.pinkA10,
+  pink11: RadixColors.pinkA.pinkA11,
+  pink12: RadixColors.pinkA.pinkA12,
+
+  red1: RadixColors.redA.redA1,
+  red2: RadixColors.redA.redA2,
+  red3: RadixColors.redA.redA3,
+  red4: RadixColors.redA.redA4,
+  red5: RadixColors.redA.redA5,
+  red6: RadixColors.redA.redA6,
+  red7: RadixColors.redA.redA7,
+  red8: RadixColors.redA.redA8,
+  red9: RadixColors.redA.redA9,
+  red10: RadixColors.redA.redA10,
+  red11: RadixColors.redA.redA11,
+  red12: RadixColors.redA.redA12,
+
+  orange1: RadixColors.orangeA.orangeA1,
+  orange2: RadixColors.orangeA.orangeA2,
+  orange3: RadixColors.orangeA.orangeA3,
+  orange4: RadixColors.orangeA.orangeA4,
+  orange5: RadixColors.orangeA.orangeA5,
+  orange6: RadixColors.orangeA.orangeA6,
+  orange7: RadixColors.orangeA.orangeA7,
+  orange8: RadixColors.orangeA.orangeA8,
+  orange9: RadixColors.orangeA.orangeA9,
+  orange10: RadixColors.orangeA.orangeA10,
+  orange11: RadixColors.orangeA.orangeA11,
+  orange12: RadixColors.orangeA.orangeA12,
+
+  yellow1: RadixColors.yellowA.yellowA1,
+  yellow2: RadixColors.yellowA.yellowA2,
+  yellow3: RadixColors.yellowA.yellowA3,
+  yellow4: RadixColors.yellowA.yellowA4,
+  yellow5: RadixColors.yellowA.yellowA5,
+  yellow6: RadixColors.yellowA.yellowA6,
+  yellow7: RadixColors.yellowA.yellowA7,
+  yellow8: RadixColors.yellowA.yellowA8,
+  yellow9: RadixColors.yellowA.yellowA9,
+  yellow10: RadixColors.yellowA.yellowA10,
+  yellow11: RadixColors.yellowA.yellowA11,
+  yellow12: RadixColors.yellowA.yellowA12,
+
+  gray1: GRAY_SCALE_LIGHT_ALPHA.gray1,
+  gray2: GRAY_SCALE_LIGHT_ALPHA.gray2,
+  gray3: GRAY_SCALE_LIGHT_ALPHA.gray3,
+  gray4: GRAY_SCALE_LIGHT_ALPHA.gray4,
+  gray5: GRAY_SCALE_LIGHT_ALPHA.gray5,
+  gray6: GRAY_SCALE_LIGHT_ALPHA.gray6,
+  gray7: GRAY_SCALE_LIGHT_ALPHA.gray7,
+  gray8: GRAY_SCALE_LIGHT_ALPHA.gray8,
+  gray9: GRAY_SCALE_LIGHT_ALPHA.gray9,
+  gray10: GRAY_SCALE_LIGHT_ALPHA.gray10,
+  gray11: GRAY_SCALE_LIGHT_ALPHA.gray11,
+  gray12: GRAY_SCALE_LIGHT_ALPHA.gray12,
+
+  mauve1: RadixColors.mauveA.mauveA1,
+  mauve2: RadixColors.mauveA.mauveA2,
+  mauve3: RadixColors.mauveA.mauveA3,
+  mauve4: RadixColors.mauveA.mauveA4,
+  mauve5: RadixColors.mauveA.mauveA5,
+  mauve6: RadixColors.mauveA.mauveA6,
+  mauve7: RadixColors.mauveA.mauveA7,
+  mauve8: RadixColors.mauveA.mauveA8,
+  mauve9: RadixColors.mauveA.mauveA9,
+  mauve10: RadixColors.mauveA.mauveA10,
+  mauve11: RadixColors.mauveA.mauveA11,
+  mauve12: RadixColors.mauveA.mauveA12,
+
+  slate1: RadixColors.slateA.slateA1,
+  slate2: RadixColors.slateA.slateA2,
+  slate3: RadixColors.slateA.slateA3,
+  slate4: RadixColors.slateA.slateA4,
+  slate5: RadixColors.slateA.slateA5,
+  slate6: RadixColors.slateA.slateA6,
+  slate7: RadixColors.slateA.slateA7,
+  slate8: RadixColors.slateA.slateA8,
+  slate9: RadixColors.slateA.slateA9,
+  slate10: RadixColors.slateA.slateA10,
+  slate11: RadixColors.slateA.slateA11,
+  slate12: RadixColors.slateA.slateA12,
+
+  sage1: RadixColors.sageA.sageA1,
+  sage2: RadixColors.sageA.sageA2,
+  sage3: RadixColors.sageA.sageA3,
+  sage4: RadixColors.sageA.sageA4,
+  sage5: RadixColors.sageA.sageA5,
+  sage6: RadixColors.sageA.sageA6,
+  sage7: RadixColors.sageA.sageA7,
+  sage8: RadixColors.sageA.sageA8,
+  sage9: RadixColors.sageA.sageA9,
+  sage10: RadixColors.sageA.sageA10,
+  sage11: RadixColors.sageA.sageA11,
+  sage12: RadixColors.sageA.sageA12,
+
+  olive1: RadixColors.oliveA.oliveA1,
+  olive2: RadixColors.oliveA.oliveA2,
+  olive3: RadixColors.oliveA.oliveA3,
+  olive4: RadixColors.oliveA.oliveA4,
+  olive5: RadixColors.oliveA.oliveA5,
+  olive6: RadixColors.oliveA.oliveA6,
+  olive7: RadixColors.oliveA.oliveA7,
+  olive8: RadixColors.oliveA.oliveA8,
+  olive9: RadixColors.oliveA.oliveA9,
+  olive10: RadixColors.oliveA.oliveA10,
+  olive11: RadixColors.oliveA.oliveA11,
+  olive12: RadixColors.oliveA.oliveA12,
+
+  sand1: RadixColors.sandA.sandA1,
+  sand2: RadixColors.sandA.sandA2,
+  sand3: RadixColors.sandA.sandA3,
+  sand4: RadixColors.sandA.sandA4,
+  sand5: RadixColors.sandA.sandA5,
+  sand6: RadixColors.sandA.sandA6,
+  sand7: RadixColors.sandA.sandA7,
+  sand8: RadixColors.sandA.sandA8,
+  sand9: RadixColors.sandA.sandA9,
+  sand10: RadixColors.sandA.sandA10,
+  sand11: RadixColors.sandA.sandA11,
+  sand12: RadixColors.sandA.sandA12,
+
+  tomato1: RadixColors.tomatoA.tomatoA1,
+  tomato2: RadixColors.tomatoA.tomatoA2,
+  tomato3: RadixColors.tomatoA.tomatoA3,
+  tomato4: RadixColors.tomatoA.tomatoA4,
+  tomato5: RadixColors.tomatoA.tomatoA5,
+  tomato6: RadixColors.tomatoA.tomatoA6,
+  tomato7: RadixColors.tomatoA.tomatoA7,
+  tomato8: RadixColors.tomatoA.tomatoA8,
+  tomato9: RadixColors.tomatoA.tomatoA9,
+  tomato10: RadixColors.tomatoA.tomatoA10,
+  tomato11: RadixColors.tomatoA.tomatoA11,
+  tomato12: RadixColors.tomatoA.tomatoA12,
+
+  ruby1: RadixColors.rubyA.rubyA1,
+  ruby2: RadixColors.rubyA.rubyA2,
+  ruby3: RadixColors.rubyA.rubyA3,
+  ruby4: RadixColors.rubyA.rubyA4,
+  ruby5: RadixColors.rubyA.rubyA5,
+  ruby6: RadixColors.rubyA.rubyA6,
+  ruby7: RadixColors.rubyA.rubyA7,
+  ruby8: RadixColors.rubyA.rubyA8,
+  ruby9: RadixColors.rubyA.rubyA9,
+  ruby10: RadixColors.rubyA.rubyA10,
+  ruby11: RadixColors.rubyA.rubyA11,
+  ruby12: RadixColors.rubyA.rubyA12,
+
+  crimson1: RadixColors.crimsonA.crimsonA1,
+  crimson2: RadixColors.crimsonA.crimsonA2,
+  crimson3: RadixColors.crimsonA.crimsonA3,
+  crimson4: RadixColors.crimsonA.crimsonA4,
+  crimson5: RadixColors.crimsonA.crimsonA5,
+  crimson6: RadixColors.crimsonA.crimsonA6,
+  crimson7: RadixColors.crimsonA.crimsonA7,
+  crimson8: RadixColors.crimsonA.crimsonA8,
+  crimson9: RadixColors.crimsonA.crimsonA9,
+  crimson10: RadixColors.crimsonA.crimsonA10,
+  crimson11: RadixColors.crimsonA.crimsonA11,
+  crimson12: RadixColors.crimsonA.crimsonA12,
+
+  plum1: RadixColors.plumA.plumA1,
+  plum2: RadixColors.plumA.plumA2,
+  plum3: RadixColors.plumA.plumA3,
+  plum4: RadixColors.plumA.plumA4,
+  plum5: RadixColors.plumA.plumA5,
+  plum6: RadixColors.plumA.plumA6,
+  plum7: RadixColors.plumA.plumA7,
+  plum8: RadixColors.plumA.plumA8,
+  plum9: RadixColors.plumA.plumA9,
+  plum10: RadixColors.plumA.plumA10,
+  plum11: RadixColors.plumA.plumA11,
+  plum12: RadixColors.plumA.plumA12,
+
+  violet1: RadixColors.violetA.violetA1,
+  violet2: RadixColors.violetA.violetA2,
+  violet3: RadixColors.violetA.violetA3,
+  violet4: RadixColors.violetA.violetA4,
+  violet5: RadixColors.violetA.violetA5,
+  violet6: RadixColors.violetA.violetA6,
+  violet7: RadixColors.violetA.violetA7,
+  violet8: RadixColors.violetA.violetA8,
+  violet9: RadixColors.violetA.violetA9,
+  violet10: RadixColors.violetA.violetA10,
+  violet11: RadixColors.violetA.violetA11,
+  violet12: RadixColors.violetA.violetA12,
+
+  iris1: RadixColors.irisA.irisA1,
+  iris2: RadixColors.irisA.irisA2,
+  iris3: RadixColors.irisA.irisA3,
+  iris4: RadixColors.irisA.irisA4,
+  iris5: RadixColors.irisA.irisA5,
+  iris6: RadixColors.irisA.irisA6,
+  iris7: RadixColors.irisA.irisA7,
+  iris8: RadixColors.irisA.irisA8,
+  iris9: RadixColors.irisA.irisA9,
+  iris10: RadixColors.irisA.irisA10,
+  iris11: RadixColors.irisA.irisA11,
+  iris12: RadixColors.irisA.irisA12,
+
+  cyan1: RadixColors.cyanA.cyanA1,
+  cyan2: RadixColors.cyanA.cyanA2,
+  cyan3: RadixColors.cyanA.cyanA3,
+  cyan4: RadixColors.cyanA.cyanA4,
+  cyan5: RadixColors.cyanA.cyanA5,
+  cyan6: RadixColors.cyanA.cyanA6,
+  cyan7: RadixColors.cyanA.cyanA7,
+  cyan8: RadixColors.cyanA.cyanA8,
+  cyan9: RadixColors.cyanA.cyanA9,
+  cyan10: RadixColors.cyanA.cyanA10,
+  cyan11: RadixColors.cyanA.cyanA11,
+  cyan12: RadixColors.cyanA.cyanA12,
+
+  jade1: RadixColors.jadeA.jadeA1,
+  jade2: RadixColors.jadeA.jadeA2,
+  jade3: RadixColors.jadeA.jadeA3,
+  jade4: RadixColors.jadeA.jadeA4,
+  jade5: RadixColors.jadeA.jadeA5,
+  jade6: RadixColors.jadeA.jadeA6,
+  jade7: RadixColors.jadeA.jadeA7,
+  jade8: RadixColors.jadeA.jadeA8,
+  jade9: RadixColors.jadeA.jadeA9,
+  jade10: RadixColors.jadeA.jadeA10,
+  jade11: RadixColors.jadeA.jadeA11,
+  jade12: RadixColors.jadeA.jadeA12,
+
+  grass1: RadixColors.grassA.grassA1,
+  grass2: RadixColors.grassA.grassA2,
+  grass3: RadixColors.grassA.grassA3,
+  grass4: RadixColors.grassA.grassA4,
+  grass5: RadixColors.grassA.grassA5,
+  grass6: RadixColors.grassA.grassA6,
+  grass7: RadixColors.grassA.grassA7,
+  grass8: RadixColors.grassA.grassA8,
+  grass9: RadixColors.grassA.grassA9,
+  grass10: RadixColors.grassA.grassA10,
+  grass11: RadixColors.grassA.grassA11,
+  grass12: RadixColors.grassA.grassA12,
+
+  mint1: RadixColors.mintA.mintA1,
+  mint2: RadixColors.mintA.mintA2,
+  mint3: RadixColors.mintA.mintA3,
+  mint4: RadixColors.mintA.mintA4,
+  mint5: RadixColors.mintA.mintA5,
+  mint6: RadixColors.mintA.mintA6,
+  mint7: RadixColors.mintA.mintA7,
+  mint8: RadixColors.mintA.mintA8,
+  mint9: RadixColors.mintA.mintA9,
+  mint10: RadixColors.mintA.mintA10,
+  mint11: RadixColors.mintA.mintA11,
+  mint12: RadixColors.mintA.mintA12,
+
+  lime1: RadixColors.limeA.limeA1,
+  lime2: RadixColors.limeA.limeA2,
+  lime3: RadixColors.limeA.limeA3,
+  lime4: RadixColors.limeA.limeA4,
+  lime5: RadixColors.limeA.limeA5,
+  lime6: RadixColors.limeA.limeA6,
+  lime7: RadixColors.limeA.limeA7,
+  lime8: RadixColors.limeA.limeA8,
+  lime9: RadixColors.limeA.limeA9,
+  lime10: RadixColors.limeA.limeA10,
+  lime11: RadixColors.limeA.limeA11,
+  lime12: RadixColors.limeA.limeA12,
+
+  bronze1: RadixColors.bronzeA.bronzeA1,
+  bronze2: RadixColors.bronzeA.bronzeA2,
+  bronze3: RadixColors.bronzeA.bronzeA3,
+  bronze4: RadixColors.bronzeA.bronzeA4,
+  bronze5: RadixColors.bronzeA.bronzeA5,
+  bronze6: RadixColors.bronzeA.bronzeA6,
+  bronze7: RadixColors.bronzeA.bronzeA7,
+  bronze8: RadixColors.bronzeA.bronzeA8,
+  bronze9: RadixColors.bronzeA.bronzeA9,
+  bronze10: RadixColors.bronzeA.bronzeA10,
+  bronze11: RadixColors.bronzeA.bronzeA11,
+  bronze12: RadixColors.bronzeA.bronzeA12,
+
+  gold1: RadixColors.goldA.goldA1,
+  gold2: RadixColors.goldA.goldA2,
+  gold3: RadixColors.goldA.goldA3,
+  gold4: RadixColors.goldA.goldA4,
+  gold5: RadixColors.goldA.goldA5,
+  gold6: RadixColors.goldA.goldA6,
+  gold7: RadixColors.goldA.goldA7,
+  gold8: RadixColors.goldA.goldA8,
+  gold9: RadixColors.goldA.goldA9,
+  gold10: RadixColors.goldA.goldA10,
+  gold11: RadixColors.goldA.goldA11,
+  gold12: RadixColors.goldA.goldA12,
+
+  brown1: RadixColors.brownA.brownA1,
+  brown2: RadixColors.brownA.brownA2,
+  brown3: RadixColors.brownA.brownA3,
+  brown4: RadixColors.brownA.brownA4,
+  brown5: RadixColors.brownA.brownA5,
+  brown6: RadixColors.brownA.brownA6,
+  brown7: RadixColors.brownA.brownA7,
+  brown8: RadixColors.brownA.brownA8,
+  brown9: RadixColors.brownA.brownA9,
+  brown10: RadixColors.brownA.brownA10,
+  brown11: RadixColors.brownA.brownA11,
+  brown12: RadixColors.brownA.brownA12,
+
+  amber1: RadixColors.amberA.amberA1,
+  amber2: RadixColors.amberA.amberA2,
+  amber3: RadixColors.amberA.amberA3,
+  amber4: RadixColors.amberA.amberA4,
+  amber5: RadixColors.amberA.amberA5,
+  amber6: RadixColors.amberA.amberA6,
+  amber7: RadixColors.amberA.amberA7,
+  amber8: RadixColors.amberA.amberA8,
+  amber9: RadixColors.amberA.amberA9,
+  amber10: RadixColors.amberA.amberA10,
+  amber11: RadixColors.amberA.amberA11,
+  amber12: RadixColors.amberA.amberA12,
+};
diff --git a/packages/twenty-new-ui/src/theme/index.ts b/packages/twenty-new-ui/src/theme/index.ts
new file mode 100644
index 00000000000..e134b8ccf6e
--- /dev/null
+++ b/packages/twenty-new-ui/src/theme/index.ts
@@ -0,0 +1,55 @@
+/*
+ * _____                    _
+ *|_   _|_      _____ _ __ | |_ _   _
+ *  | | \ \ /\ / / _ \ '_ \| __| | | | Auto-generated file
+ *  | |  \ V  V /  __/ | | | |_| |_| | Any edits to this will be overridden
+ *  |_|   \_/\_/ \___|_| |_|\__|\__, |
+ *                              |___/
+ */
+
+export { ACCENT_DARK } from './constants/AccentDark';
+export { ACCENT_LIGHT } from './constants/AccentLight';
+export type { AnimationDuration } from './constants/Animation';
+export { ANIMATION } from './constants/Animation';
+export { BACKGROUND_DARK } from './constants/BackgroundDark';
+export { BACKGROUND_LIGHT } from './constants/BackgroundLight';
+export { BLUR_DARK } from './constants/BlurDark';
+export { BLUR_LIGHT } from './constants/BlurLight';
+export { BORDER_COMMON } from './constants/BorderCommon';
+export { BORDER_DARK } from './constants/BorderDark';
+export { BORDER_LIGHT } from './constants/BorderLight';
+export { BOX_SHADOW_DARK } from './constants/BoxShadowDark';
+export { BOX_SHADOW_LIGHT } from './constants/BoxShadowLight';
+export { CODE_DARK } from './constants/CodeDark';
+export { CODE_LIGHT } from './constants/CodeLight';
+export { COLOR_DARK } from './constants/ColorsDark';
+export { COLOR_LIGHT } from './constants/ColorsLight';
+export { DEFAULT_THEME_COLOR_FALLBACK } from './constants/DefaultThemeColorFallback';
+export { FONT_COMMON } from './constants/FontCommon';
+export { FONT_DARK } from './constants/FontDark';
+export { FONT_LIGHT } from './constants/FontLight';
+export { GRAY_SCALE_DARK } from './constants/GrayScaleDark';
+export { GRAY_SCALE_DARK_ALPHA } from './constants/GrayScaleDarkAlpha';
+export { GRAY_SCALE_LIGHT } from './constants/GrayScaleLight';
+export { GRAY_SCALE_LIGHT_ALPHA } from './constants/GrayScaleLightAlpha';
+export { ICON } from './constants/Icon';
+export { ILLUSTRATION_ICON_DARK } from './constants/IllustrationIconDark';
+export { ILLUSTRATION_ICON_LIGHT } from './constants/IllustrationIconLight';
+export type { ThemeColor } from './constants/MainColorNames';
+export { MAIN_COLOR_NAMES } from './constants/MainColorNames';
+export { MAIN_COLORS_DARK } from './constants/MainColorsDark';
+export { MAIN_COLORS_LIGHT } from './constants/MainColorsLight';
+export { MODAL } from './constants/Modal';
+export { RGBA } from './constants/Rgba';
+export { SECONDARY_COLORS_DARK } from './constants/SecondaryColorsDark';
+export { SECONDARY_COLORS_LIGHT } from './constants/SecondaryColorsLight';
+export { SNACK_BAR_DARK } from './constants/SnackBarDark';
+export { SNACK_BAR_LIGHT } from './constants/SnackBarLight';
+export { TAG_DARK } from './constants/TagDark';
+export { TAG_LIGHT } from './constants/TagLight';
+export { TEXT } from './constants/Text';
+export { THEME_COMMON } from './constants/ThemeCommon';
+export { THEME_DARK } from './constants/ThemeDark';
+export { THEME_LIGHT } from './constants/ThemeLight';
+export { TRANSPARENT_COLORS_DARK } from './constants/TransparentColorsDark';
+export { TRANSPARENT_COLORS_LIGHT } from './constants/TransparentColorsLight';
diff --git a/packages/twenty-new-ui/src/utilities/index.ts b/packages/twenty-new-ui/src/utilities/index.ts
new file mode 100644
index 00000000000..e7f0b0e304e
--- /dev/null
+++ b/packages/twenty-new-ui/src/utilities/index.ts
@@ -0,0 +1,2 @@
+// Auto-generated barrel placeholder — populated as components migrate into this entry point.
+export {};
diff --git a/packages/twenty-new-ui/src/vite-env.d.ts b/packages/twenty-new-ui/src/vite-env.d.ts
new file mode 100644
index 00000000000..b1f45c78666
--- /dev/null
+++ b/packages/twenty-new-ui/src/vite-env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="vite/client" />
+/// <reference types="vite-plugin-svgr/client" />
diff --git a/packages/twenty-new-ui/tsconfig.json b/packages/twenty-new-ui/tsconfig.json
new file mode 100644
index 00000000000..7ff5429b60c
--- /dev/null
+++ b/packages/twenty-new-ui/tsconfig.json
@@ -0,0 +1,30 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "target": "ES2020",
+    "jsx": "react-jsx",
+    "allowJs": false,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "moduleResolution": "bundler",
+    "esModuleInterop": true,
+    "noEmit": true,
+    "types": ["node", "jest"],
+    "outDir": "../../.cache/tsc",
+    "paths": {
+      "@new-ui/*": ["./src/*"],
+      "@assets/*": ["./src/assets/*"],
+      "@styles/*": ["./src/styles/*"]
+    }
+  },
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "src/**/*.d.ts",
+    ".storybook/*.ts",
+    ".storybook/*.tsx",
+    "jest.config.mjs",
+    "setupTests.ts",
+    "vite.config.ts"
+  ]
+}
diff --git a/packages/twenty-new-ui/tsconfig.lib.json b/packages/twenty-new-ui/tsconfig.lib.json
new file mode 100644
index 00000000000..ead3d78666a
--- /dev/null
+++ b/packages/twenty-new-ui/tsconfig.lib.json
@@ -0,0 +1,22 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "declaration": true,
+    "declarationMap": true,
+    "noEmit": false
+  },
+  "include": [
+    "src/**/*.d.ts",
+    "src/**/*.scss.d.ts",
+    "src/**/*.ts",
+    "src/**/*.tsx"
+  ],
+  "exclude": [
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "**/*.stories.ts",
+    "**/*.stories.tsx",
+    "**/*.test.ts",
+    "**/*.test.tsx"
+  ]
+}
diff --git a/packages/twenty-new-ui/vite.config.individual.ts b/packages/twenty-new-ui/vite.config.individual.ts
new file mode 100644
index 00000000000..4f86613cb95
--- /dev/null
+++ b/packages/twenty-new-ui/vite.config.individual.ts
@@ -0,0 +1,78 @@
+import react from '@vitejs/plugin-react-swc';
+import * as path from 'path';
+import { defineConfig } from 'vite';
+import svgr from 'vite-plugin-svgr';
+import tsconfigPaths from 'vite-tsconfig-paths';
+
+import packageJson from './package.json';
+
+const depNames = Object.keys(packageJson.dependencies || {});
+
+const isExternal = (id: string): boolean =>
+  depNames.some((dep) => id === dep || id.startsWith(dep + '/'));
+
+export default defineConfig(() => {
+  return {
+    resolve: {
+      alias: {
+        '@new-ui/': path.resolve(__dirname, 'src') + '/',
+        '@assets/': path.resolve(__dirname, 'src/assets') + '/',
+        '@styles/': path.resolve(__dirname, 'src/styles') + '/',
+      },
+    },
+    css: {
+      modules: {
+        localsConvention: 'camelCaseOnly',
+      },
+      preprocessorOptions: {
+        scss: {
+          api: 'modern-compiler',
+          loadPaths: [path.resolve(__dirname, 'src/styles')],
+          additionalData: [
+            `@use 'abstracts/functions' as *;`,
+            `@use 'abstracts/mixins' as *;`,
+            `@use 'abstracts/breakpoints' as *;`,
+            '',
+          ].join('\n'),
+        },
+      },
+    },
+    root: __dirname,
+    cacheDir: '../../node_modules/.vite/packages/twenty-new-ui-individual',
+    assetsInclude: ['src/**/*.svg'],
+    plugins: [
+      react(),
+      tsconfigPaths({
+        root: __dirname,
+        projects: ['tsconfig.json'],
+      }),
+      svgr(),
+    ],
+    build: {
+      cssCodeSplit: false,
+      minify: 'esbuild',
+      sourcemap: true,
+      outDir: './dist/individual',
+      emptyOutDir: true,
+      commonjsOptions: {
+        transformMixedEsModules: true,
+        interopDefault: true,
+        defaultIsModuleExports: true,
+        requireReturnsDefault: 'auto',
+      },
+      lib: {
+        entry: 'src/individual-entry.ts',
+        formats: ['es'],
+      },
+      rollupOptions: {
+        external: isExternal,
+        output: {
+          preserveModules: true,
+          preserveModulesRoot: 'src',
+          entryFileNames: '[name].js',
+        },
+      },
+    },
+    logLevel: 'warn',
+  };
+});
diff --git a/packages/twenty-new-ui/vite.config.ts b/packages/twenty-new-ui/vite.config.ts
new file mode 100644
index 00000000000..5d8fe6eab36
--- /dev/null
+++ b/packages/twenty-new-ui/vite.config.ts
@@ -0,0 +1,170 @@
+import react from '@vitejs/plugin-react-swc';
+import * as fs from 'fs';
+import * as path from 'path';
+import { defineConfig } from 'vite';
+import checker from 'vite-plugin-checker';
+import dts, { type PluginOptions } from 'vite-plugin-dts';
+import sassDts from 'vite-plugin-sass-dts';
+import svgr from 'vite-plugin-svgr';
+import tsconfigPaths from 'vite-tsconfig-paths';
+
+type Checkers = Parameters<typeof checker>[0];
+
+import packageJson from './package.json';
+
+const entries = Object.keys(packageJson.exports)
+  .filter((el) => !el.endsWith('.css'))
+  .map((module) => `src/${module}/index.ts`);
+
+const entryFileNames = (chunk: any, extension: 'cjs' | 'mjs') => {
+  if (!chunk.isEntry) {
+    throw new Error(
+      `Should never occurs, encountered a non entry chunk ${chunk.facadeModuleId}`,
+    );
+  }
+
+  const splitFaceModuleId = chunk.facadeModuleId?.split('/');
+  if (splitFaceModuleId === undefined) {
+    throw new Error(
+      `Should never occurs splitFaceModuleId is undefined ${chunk.facadeModuleId}`,
+    );
+  }
+
+  const moduleDirectory = splitFaceModuleId[splitFaceModuleId?.length - 2];
+  if (moduleDirectory === 'src') {
+    return `${chunk.name}.${extension}`;
+  }
+  return `${moduleDirectory}.${extension}`;
+};
+
+export default defineConfig(({ command }) => {
+  const isBuildCommand = command === 'build';
+
+  const tsConfigPath = isBuildCommand
+    ? path.resolve(__dirname, './tsconfig.lib.json')
+    : path.resolve(__dirname, './tsconfig.json');
+
+  const checkersConfig: Checkers = {
+    typescript: {
+      tsconfigPath: tsConfigPath,
+    },
+  };
+
+  const dtsConfig: PluginOptions = {
+    entryRoot: 'src',
+    tsconfigPath: tsConfigPath,
+  };
+
+  const BUNDLED_DEPS = ['@tabler/icons-react'];
+
+  const externalDeps = Object.keys(packageJson.dependencies || {}).filter(
+    (dep) => !BUNDLED_DEPS.includes(dep),
+  );
+
+  return {
+    resolve: {
+      alias: {
+        '@new-ui/': path.resolve(__dirname, 'src') + '/',
+        '@assets/': path.resolve(__dirname, 'src/assets') + '/',
+        '@styles/': path.resolve(__dirname, 'src/styles') + '/',
+        '@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
+      },
+    },
+    css: {
+      modules: {
+        localsConvention: 'camelCaseOnly',
+      },
+      preprocessorOptions: {
+        scss: {
+          api: 'modern-compiler',
+          loadPaths: [path.resolve(__dirname, 'src/styles')],
+          additionalData: [
+            `@use 'abstracts/functions' as *;`,
+            `@use 'abstracts/mixins' as *;`,
+            `@use 'abstracts/breakpoints' as *;`,
+            '',
+          ].join('\n'),
+        },
+      },
+    },
+    optimizeDeps: {
+      exclude: ['../../node_modules/.vite', '../../node_modules/.cache'],
+    },
+    root: __dirname,
+    cacheDir: '../../node_modules/.vite/packages/twenty-new-ui',
+    assetsInclude: ['src/**/*.svg'],
+    plugins: [
+      react(),
+      tsconfigPaths({
+        root: __dirname,
+        projects: ['tsconfig.json'],
+      }),
+      svgr(),
+      // Generates typed *.module.scss.d.ts siblings (dev mode only — backed by
+      // sass-embedded). CI/build relies on the ambient src/scss-modules.d.ts.
+      sassDts({ esmExport: true, legacyFileFormat: true }),
+      dts(dtsConfig),
+      checker(checkersConfig),
+      {
+        name: 'copy-theme-css',
+        closeBundle() {
+          const distDir = path.resolve(__dirname, 'dist');
+          fs.mkdirSync(distDir, { recursive: true });
+          const themeCssFiles = ['theme-light.css', 'theme-dark.css'];
+          for (const file of themeCssFiles) {
+            fs.copyFileSync(
+              path.resolve(__dirname, `src/theme-constants/${file}`),
+              path.resolve(distDir, file),
+            );
+          }
+        },
+      },
+    ],
+    build: {
+      cssCodeSplit: false,
+      minify: 'esbuild',
+      sourcemap: false,
+      emptyOutDir: false,
+      outDir: './dist',
+      reportCompressedSize: true,
+      commonjsOptions: {
+        transformMixedEsModules: true,
+        interopDefault: true,
+        defaultIsModuleExports: true,
+        requireReturnsDefault: 'auto',
+      },
+      lib: {
+        entry: ['src/index.ts', ...entries],
+        name: 'twenty-new-ui',
+      },
+      rollupOptions: {
+        external: (id: string) =>
+          externalDeps.some((dep) => id === dep || id.startsWith(dep + '/')),
+        output: [
+          {
+            assetFileNames: 'style.css',
+            globals: {
+              react: 'React',
+              'react-dom': 'ReactDOM',
+            },
+            format: 'es',
+            entryFileNames: (chunk) => entryFileNames(chunk, 'mjs'),
+          },
+          {
+            assetFileNames: 'style.css',
+            format: 'cjs',
+            globals: {
+              react: 'React',
+              'react-dom': 'ReactDOM',
+            },
+            interop: 'auto',
+            esModule: true,
+            exports: 'named',
+            entryFileNames: (chunk) => entryFileNames(chunk, 'cjs'),
+          },
+        ],
+      },
+    },
+    logLevel: 'error',
+  };
+});
diff --git a/packages/twenty-new-ui/vitest.config.ts b/packages/twenty-new-ui/vitest.config.ts
new file mode 100644
index 00000000000..a13517123cc
--- /dev/null
+++ b/packages/twenty-new-ui/vitest.config.ts
@@ -0,0 +1,51 @@
+import { argosVitestPlugin } from '@argos-ci/storybook/vitest-plugin';
+import { storybookTest } from '@storybook/addon-vitest/vitest-plugin';
+import { playwright } from '@vitest/browser-playwright';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { defineConfig } from 'vitest/config';
+
+const MINUTES_IN_MS = 60 * 1000;
+
+const dirname =
+  typeof __dirname !== 'undefined'
+    ? __dirname
+    : path.dirname(fileURLToPath(import.meta.url));
+
+export default defineConfig({
+  test: {
+    projects: [
+      {
+        extends: './vite.config.ts',
+        plugins: [
+          storybookTest({
+            configDir: path.join(dirname, '.storybook'),
+            ...(process.env.STORYBOOK_URL
+              ? { storybookUrl: process.env.STORYBOOK_URL }
+              : { storybookScript: 'yarn storybook --no-open --port 6008' }),
+          }),
+          argosVitestPlugin({
+            uploadToArgos: !!process.env.ARGOS_TOKEN,
+            token: process.env.ARGOS_TOKEN,
+            apiBaseUrl: process.env.ARGOS_API_BASE_URL,
+            buildName: process.env.ARGOS_BUILD_NAME || undefined,
+            branch: process.env.ARGOS_BRANCH || undefined,
+            commit: process.env.ARGOS_COMMIT || undefined,
+            referenceCommit: process.env.ARGOS_REFERENCE_COMMIT || undefined,
+          }),
+        ],
+        test: {
+          name: 'storybook',
+          browser: {
+            enabled: true,
+            headless: true,
+            provider: playwright({}),
+            instances: [{ browser: 'chromium' }],
+          },
+          setupFiles: ['./.storybook/vitest.setup.ts'],
+          testTimeout: 5 * MINUTES_IN_MS,
+        },
+      },
+    ],
+  },
+});
diff --git a/yarn.lock b/yarn.lock
index a25c9213b9d..680d6967fdc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4261,6 +4261,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/runtime@npm:^7.29.2":
+  version: 7.29.7
+  resolution: "@babel/runtime@npm:7.29.7"
+  checksum: 10c0/ca11572f7146b21e0bde6a9ed4bb6a89eafbee5f0944c7eb54d0d8a2dac962c33638a1d611e14faa71dfbb92b4b5f9236232208568a6b7d5c6f3f39ddb91771e
+  languageName: node
+  linkType: hard
+
 "@babel/template@npm:^7.18.10, @babel/template@npm:^7.22.15, @babel/template@npm:^7.25.9, @babel/template@npm:^7.27.2, @babel/template@npm:^7.3.3":
   version: 7.27.2
   resolution: "@babel/template@npm:7.27.2"
@@ -4379,6 +4386,32 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@base-ui/react@npm:^1.5.0":
+  version: 1.5.0
+  resolution: "@base-ui/react@npm:1.5.0"
+  dependencies:
+    "@babel/runtime": "npm:^7.29.2"
+    "@base-ui/utils": "npm:0.2.9"
+    "@floating-ui/react-dom": "npm:^2.1.8"
+    "@floating-ui/utils": "npm:^0.2.11"
+    use-sync-external-store: "npm:^1.6.0"
+  peerDependencies:
+    "@date-fns/tz": ^1.2.0
+    "@types/react": ^17 || ^18 || ^19
+    date-fns: ^4.0.0
+    react: ^17 || ^18 || ^19
+    react-dom: ^17 || ^18 || ^19
+  peerDependenciesMeta:
+    "@date-fns/tz":
+      optional: true
+    "@types/react":
+      optional: true
+    date-fns:
+      optional: true
+  checksum: 10c0/ba0f00149d7500d39e0e790b4b6cf19c002f4281508b6076ed1e367ca9a4946eb345e98d4c0dd0ab8e1613807bdcac9d9ad07f6c6d19c3b243a022bb30cbb61b
+  languageName: node
+  linkType: hard
+
 "@base-ui/utils@npm:0.2.6, @base-ui/utils@npm:^0.2.6":
   version: 0.2.6
   resolution: "@base-ui/utils@npm:0.2.6"
@@ -4398,6 +4431,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@base-ui/utils@npm:0.2.9":
+  version: 0.2.9
+  resolution: "@base-ui/utils@npm:0.2.9"
+  dependencies:
+    "@babel/runtime": "npm:^7.29.2"
+    "@floating-ui/utils": "npm:^0.2.11"
+    reselect: "npm:^5.1.1"
+    use-sync-external-store: "npm:^1.6.0"
+  peerDependencies:
+    "@types/react": ^17 || ^18 || ^19
+    react: ^17 || ^18 || ^19
+    react-dom: ^17 || ^18 || ^19
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/169a67fb6a4d86d3ce9fb12bc1e8cb02a67ad3d16872c81798cd6a532c9277383c4066c88356a9813499a87b93b4bf255ea035ea3c6f7298c52adeb1e8e846ce
+  languageName: node
+  linkType: hard
+
 "@bcoe/v8-coverage@npm:^0.2.3":
   version: 0.2.3
   resolution: "@bcoe/v8-coverage@npm:0.2.3"
@@ -4580,6 +4632,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@bufbuild/protobuf@npm:^2.5.0":
+  version: 2.12.0
+  resolution: "@bufbuild/protobuf@npm:2.12.0"
+  checksum: 10c0/28959e371fd2e7c8d67d52af9e3c8f8e6770e2e116dcc5508f469ca736afa6905e216bc76183835898a5f3deb8aa2e7db47d4a0e706fba76115e9a1996893191
+  languageName: node
+  linkType: hard
+
 "@bufbuild/protobuf@npm:^2.6.2":
   version: 2.10.1
   resolution: "@bufbuild/protobuf@npm:2.10.1"
@@ -15696,6 +15755,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-android-arm64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-android-arm64@npm:2.5.6"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-darwin-arm64@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-darwin-arm64@npm:2.4.1"
@@ -15703,6 +15769,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-darwin-arm64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-darwin-arm64@npm:2.5.6"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-darwin-x64@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-darwin-x64@npm:2.4.1"
@@ -15710,6 +15783,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-darwin-x64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-darwin-x64@npm:2.5.6"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-freebsd-x64@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-freebsd-x64@npm:2.4.1"
@@ -15717,6 +15797,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-freebsd-x64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-freebsd-x64@npm:2.5.6"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-linux-arm-glibc@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-linux-arm-glibc@npm:2.4.1"
@@ -15724,6 +15811,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-linux-arm-glibc@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-arm-glibc@npm:2.5.6"
+  conditions: os=linux & cpu=arm & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@parcel/watcher-linux-arm-musl@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-arm-musl@npm:2.5.6"
+  conditions: os=linux & cpu=arm & libc=musl
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-linux-arm64-glibc@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-linux-arm64-glibc@npm:2.4.1"
@@ -15731,6 +15832,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-linux-arm64-glibc@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-arm64-glibc@npm:2.5.6"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-linux-arm64-musl@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-linux-arm64-musl@npm:2.4.1"
@@ -15738,6 +15846,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-linux-arm64-musl@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-arm64-musl@npm:2.5.6"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-linux-x64-glibc@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-linux-x64-glibc@npm:2.4.1"
@@ -15745,6 +15860,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-linux-x64-glibc@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-x64-glibc@npm:2.5.6"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-linux-x64-musl@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-linux-x64-musl@npm:2.4.1"
@@ -15752,6 +15874,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-linux-x64-musl@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-linux-x64-musl@npm:2.5.6"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-win32-arm64@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-win32-arm64@npm:2.4.1"
@@ -15759,6 +15888,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-win32-arm64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-win32-arm64@npm:2.5.6"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-win32-ia32@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-win32-ia32@npm:2.4.1"
@@ -15766,6 +15902,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-win32-ia32@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-win32-ia32@npm:2.5.6"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher-win32-x64@npm:2.4.1":
   version: 2.4.1
   resolution: "@parcel/watcher-win32-x64@npm:2.4.1"
@@ -15773,6 +15916,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher-win32-x64@npm:2.5.6":
+  version: 2.5.6
+  resolution: "@parcel/watcher-win32-x64@npm:2.5.6"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@parcel/watcher@npm:^2.1.0":
   version: 2.4.1
   resolution: "@parcel/watcher@npm:2.4.1"
@@ -15823,6 +15973,59 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@parcel/watcher@npm:^2.4.1":
+  version: 2.5.6
+  resolution: "@parcel/watcher@npm:2.5.6"
+  dependencies:
+    "@parcel/watcher-android-arm64": "npm:2.5.6"
+    "@parcel/watcher-darwin-arm64": "npm:2.5.6"
+    "@parcel/watcher-darwin-x64": "npm:2.5.6"
+    "@parcel/watcher-freebsd-x64": "npm:2.5.6"
+    "@parcel/watcher-linux-arm-glibc": "npm:2.5.6"
+    "@parcel/watcher-linux-arm-musl": "npm:2.5.6"
+    "@parcel/watcher-linux-arm64-glibc": "npm:2.5.6"
+    "@parcel/watcher-linux-arm64-musl": "npm:2.5.6"
+    "@parcel/watcher-linux-x64-glibc": "npm:2.5.6"
+    "@parcel/watcher-linux-x64-musl": "npm:2.5.6"
+    "@parcel/watcher-win32-arm64": "npm:2.5.6"
+    "@parcel/watcher-win32-ia32": "npm:2.5.6"
+    "@parcel/watcher-win32-x64": "npm:2.5.6"
+    detect-libc: "npm:^2.0.3"
+    is-glob: "npm:^4.0.3"
+    node-addon-api: "npm:^7.0.0"
+    node-gyp: "npm:latest"
+    picomatch: "npm:^4.0.3"
+  dependenciesMeta:
+    "@parcel/watcher-android-arm64":
+      optional: true
+    "@parcel/watcher-darwin-arm64":
+      optional: true
+    "@parcel/watcher-darwin-x64":
+      optional: true
+    "@parcel/watcher-freebsd-x64":
+      optional: true
+    "@parcel/watcher-linux-arm-glibc":
+      optional: true
+    "@parcel/watcher-linux-arm-musl":
+      optional: true
+    "@parcel/watcher-linux-arm64-glibc":
+      optional: true
+    "@parcel/watcher-linux-arm64-musl":
+      optional: true
+    "@parcel/watcher-linux-x64-glibc":
+      optional: true
+    "@parcel/watcher-linux-x64-musl":
+      optional: true
+    "@parcel/watcher-win32-arm64":
+      optional: true
+    "@parcel/watcher-win32-ia32":
+      optional: true
+    "@parcel/watcher-win32-x64":
+      optional: true
+  checksum: 10c0/1e1d91f92e94e4640089a7cead243b2b81ca9aa8e1c862a97a25f589e84fbf1ad93abeb503f325c43a8c0e024ae0e74b48ec42c1cd84e8e423a3a87d25ded4f2
+  languageName: node
+  linkType: hard
+
 "@peculiar/asn1-schema@npm:^2.3.8":
   version: 2.3.13
   resolution: "@peculiar/asn1-schema@npm:2.3.13"
@@ -19095,6 +19298,40 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@size-limit/esbuild@npm:11.2.0":
+  version: 11.2.0
+  resolution: "@size-limit/esbuild@npm:11.2.0"
+  dependencies:
+    esbuild: "npm:^0.25.0"
+    nanoid: "npm:^5.1.0"
+  peerDependencies:
+    size-limit: 11.2.0
+  checksum: 10c0/8740fd6f86d0be14bd7492781a9611f12fdbeafefa590ed485ce4f1768b521da8847c5ab314253bd0bb6decb50b5b5fe8f3cba7adc5cc9e55ebccbad6a161df3
+  languageName: node
+  linkType: hard
+
+"@size-limit/file@npm:11.2.0":
+  version: 11.2.0
+  resolution: "@size-limit/file@npm:11.2.0"
+  peerDependencies:
+    size-limit: 11.2.0
+  checksum: 10c0/25fb431c2afa9293774842f3abb12ee0aaa988585a2be545f2a4f90ffd5c638a13bada10a0b71e376cefb426bd991793d0e1ffe970b94a4e0bb8b0a8b504f343
+  languageName: node
+  linkType: hard
+
+"@size-limit/preset-small-lib@npm:^11.1.6":
+  version: 11.2.0
+  resolution: "@size-limit/preset-small-lib@npm:11.2.0"
+  dependencies:
+    "@size-limit/esbuild": "npm:11.2.0"
+    "@size-limit/file": "npm:11.2.0"
+    size-limit: "npm:11.2.0"
+  peerDependencies:
+    size-limit: 11.2.0
+  checksum: 10c0/3b1f55fde435794d83245687bc4e2e6996ddb178c774af62b57754e9b7d6ea1db3ef041f0706bd1ffb45da2fa52eba50594ce92ab312637e4198ee06274de673
+  languageName: node
+  linkType: hard
+
 "@smithy/abort-controller@npm:^4.2.10":
   version: 4.2.10
   resolution: "@smithy/abort-controller@npm:4.2.10"
@@ -20448,6 +20685,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@storybook/addon-a11y@npm:^10.3.3":
+  version: 10.4.1
+  resolution: "@storybook/addon-a11y@npm:10.4.1"
+  dependencies:
+    "@storybook/global": "npm:^5.0.0"
+    axe-core: "npm:^4.2.0"
+  peerDependencies:
+    storybook: ^10.4.1
+  checksum: 10c0/2a051276db77dbf196b0c509aae6e49e1d1a722db1ecd3a73fa60ff8c1d88e61900f9c31a66201cedab8dd555718fca407099b4f27662fd3d9404b2096770344
+  languageName: node
+  linkType: hard
+
 "@storybook/addon-coverage@npm:^3.0.0":
   version: 3.0.0
   resolution: "@storybook/addon-coverage@npm:3.0.0"
@@ -24304,7 +24553,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitest/browser-playwright@npm:^4.0.18":
+"@vitest/browser-playwright@npm:4.0.18, @vitest/browser-playwright@npm:^4.0.18":
   version: 4.0.18
   resolution: "@vitest/browser-playwright@npm:4.0.18"
   dependencies:
@@ -27848,6 +28097,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"axe-core@npm:^4.2.0":
+  version: 4.11.4
+  resolution: "axe-core@npm:4.11.4"
+  checksum: 10c0/c4aa83fc3eac5f7a0d0cb1a28f9d073acf0c06ce8daacc38608faa278c57ce084c028c850746b98817ae4c101c30c1a32e95ea34748c4b4c7419b9b81221ef84
+  languageName: node
+  linkType: hard
+
 "axios-retry@npm:^4.5.0":
   version: 4.5.0
   resolution: "axios-retry@npm:4.5.0"
@@ -29102,6 +29358,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"bytes-iec@npm:^3.1.1":
+  version: 3.1.1
+  resolution: "bytes-iec@npm:3.1.1"
+  checksum: 10c0/cb553a214d49afe2efb4f9f6f03c0a76dbf2b0db8fe176c1d9943f74b79fb36767938e5f0a60991d870309c96f21e440904dd4f92b54c9c316c88486e6eef025
+  languageName: node
+  linkType: hard
+
 "bytes@npm:3.1.2, bytes@npm:^3.1.2, bytes@npm:~3.1.2":
   version: 3.1.2
   resolution: "bytes@npm:3.1.2"
@@ -30465,6 +30728,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"colorjs.io@npm:^0.5.0":
+  version: 0.5.2
+  resolution: "colorjs.io@npm:0.5.2"
+  checksum: 10c0/2e6ea43629e325e721b92429239de3a6f42fb6d88ba6e4c2aeff0288c196d876f2f7ee82aea95bd40072d5cdc8cb87f042f4d94c134dcabf0e34a717e4caacb9
+  languageName: node
+  linkType: hard
+
 "colors@npm:1.0.3":
   version: 1.0.3
   resolution: "colors@npm:1.0.3"
@@ -38460,6 +38730,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"immutable@npm:^5.1.5":
+  version: 5.1.6
+  resolution: "immutable@npm:5.1.6"
+  checksum: 10c0/79eb033f68ca70fca60fb052c87b5420034e460e306ce9bea2558fd7b5e0b3b59c28c4a4653867305992b4a30e169b353175d78126c1be6ed0113794b27e3317
+  languageName: node
+  linkType: hard
+
 "immutable@npm:~3.7.6":
   version: 3.7.6
   resolution: "immutable@npm:3.7.6"
@@ -44951,6 +45228,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"nanoid@npm:^5.1.0":
+  version: 5.1.11
+  resolution: "nanoid@npm:5.1.11"
+  bin:
+    nanoid: bin/nanoid.js
+  checksum: 10c0/91580d18c29263ac0e871734f0d86e7f906f523f974d3c30fc65354ccf387ccffd606c2a6c28acc2977a3950146347e790ce9e3f514133a48995af5ccdb308ce
+  languageName: node
+  linkType: hard
+
 "nanoid@npm:^5.1.3":
   version: 5.1.6
   resolution: "nanoid@npm:5.1.6"
@@ -44960,6 +45246,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"nanospinner@npm:^1.2.2":
+  version: 1.2.2
+  resolution: "nanospinner@npm:1.2.2"
+  dependencies:
+    picocolors: "npm:^1.1.1"
+  checksum: 10c0/07264f63816a8ec24d84ffe216a605cf11dffd8b098d4c5e6790437304b47e10ce4fc341de8dbcfc1b59aa42107f9949c89bcc201239eb61a80e14b6b1a20c90
+  languageName: node
+  linkType: hard
+
 "napi-build-utils@npm:^1.0.1":
   version: 1.0.2
   resolution: "napi-build-utils@npm:1.0.2"
@@ -51609,7 +51904,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"rxjs@npm:7.8.2, rxjs@npm:^7.8.2":
+"rxjs@npm:7.8.2, rxjs@npm:^7.4.0, rxjs@npm:^7.8.2":
   version: 7.8.2
   resolution: "rxjs@npm:7.8.2"
   dependencies:
@@ -51696,6 +51991,225 @@ __metadata:
   languageName: node
   linkType: hard
 
+"sass-embedded-all-unknown@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-all-unknown@npm:1.100.0"
+  dependencies:
+    sass: "npm:1.100.0"
+  conditions: (!cpu=arm | !cpu=arm64 | !cpu=riscv64 | !cpu=x64)
+  languageName: node
+  linkType: hard
+
+"sass-embedded-android-arm64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-android-arm64@npm:1.100.0"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-android-arm@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-android-arm@npm:1.100.0"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
+"sass-embedded-android-riscv64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-android-riscv64@npm:1.100.0"
+  conditions: os=android & cpu=riscv64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-android-x64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-android-x64@npm:1.100.0"
+  conditions: os=android & cpu=x64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-darwin-arm64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-darwin-arm64@npm:1.100.0"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-darwin-x64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-darwin-x64@npm:1.100.0"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-arm64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-arm64@npm:1.100.0"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-arm@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-arm@npm:1.100.0"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-musl-arm64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-musl-arm64@npm:1.100.0"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-musl-arm@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-musl-arm@npm:1.100.0"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-musl-riscv64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-musl-riscv64@npm:1.100.0"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-musl-x64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-musl-x64@npm:1.100.0"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-riscv64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-riscv64@npm:1.100.0"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-linux-x64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-linux-x64@npm:1.100.0"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-unknown-all@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-unknown-all@npm:1.100.0"
+  dependencies:
+    sass: "npm:1.100.0"
+  conditions: (!os=android | !os=darwin | !os=linux | !os=win32)
+  languageName: node
+  linkType: hard
+
+"sass-embedded-win32-arm64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-win32-arm64@npm:1.100.0"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"sass-embedded-win32-x64@npm:1.100.0":
+  version: 1.100.0
+  resolution: "sass-embedded-win32-x64@npm:1.100.0"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
+"sass-embedded@npm:^1.83.0":
+  version: 1.100.0
+  resolution: "sass-embedded@npm:1.100.0"
+  dependencies:
+    "@bufbuild/protobuf": "npm:^2.5.0"
+    colorjs.io: "npm:^0.5.0"
+    immutable: "npm:^5.1.5"
+    rxjs: "npm:^7.4.0"
+    sass-embedded-all-unknown: "npm:1.100.0"
+    sass-embedded-android-arm: "npm:1.100.0"
+    sass-embedded-android-arm64: "npm:1.100.0"
+    sass-embedded-android-riscv64: "npm:1.100.0"
+    sass-embedded-android-x64: "npm:1.100.0"
+    sass-embedded-darwin-arm64: "npm:1.100.0"
+    sass-embedded-darwin-x64: "npm:1.100.0"
+    sass-embedded-linux-arm: "npm:1.100.0"
+    sass-embedded-linux-arm64: "npm:1.100.0"
+    sass-embedded-linux-musl-arm: "npm:1.100.0"
+    sass-embedded-linux-musl-arm64: "npm:1.100.0"
+    sass-embedded-linux-musl-riscv64: "npm:1.100.0"
+    sass-embedded-linux-musl-x64: "npm:1.100.0"
+    sass-embedded-linux-riscv64: "npm:1.100.0"
+    sass-embedded-linux-x64: "npm:1.100.0"
+    sass-embedded-unknown-all: "npm:1.100.0"
+    sass-embedded-win32-arm64: "npm:1.100.0"
+    sass-embedded-win32-x64: "npm:1.100.0"
+    supports-color: "npm:^8.1.1"
+    sync-child-process: "npm:^1.0.2"
+    varint: "npm:^6.0.0"
+  dependenciesMeta:
+    sass-embedded-all-unknown:
+      optional: true
+    sass-embedded-android-arm:
+      optional: true
+    sass-embedded-android-arm64:
+      optional: true
+    sass-embedded-android-riscv64:
+      optional: true
+    sass-embedded-android-x64:
+      optional: true
+    sass-embedded-darwin-arm64:
+      optional: true
+    sass-embedded-darwin-x64:
+      optional: true
+    sass-embedded-linux-arm:
+      optional: true
+    sass-embedded-linux-arm64:
+      optional: true
+    sass-embedded-linux-musl-arm:
+      optional: true
+    sass-embedded-linux-musl-arm64:
+      optional: true
+    sass-embedded-linux-musl-riscv64:
+      optional: true
+    sass-embedded-linux-musl-x64:
+      optional: true
+    sass-embedded-linux-riscv64:
+      optional: true
+    sass-embedded-linux-x64:
+      optional: true
+    sass-embedded-unknown-all:
+      optional: true
+    sass-embedded-win32-arm64:
+      optional: true
+    sass-embedded-win32-x64:
+      optional: true
+  bin:
+    sass: dist/bin/sass.js
+  checksum: 10c0/62650f86a2530614720dd38a650ebcd7c1d5115c157e2ee9f1f7e0fa64c0dd7d7d47624e0b7f3dfe6e6c080e14f9e0b3231e5edb365b7292423f0e8fcc4a7ad8
+  languageName: node
+  linkType: hard
+
+"sass@npm:1.100.0, sass@npm:^1.83.0":
+  version: 1.100.0
+  resolution: "sass@npm:1.100.0"
+  dependencies:
+    "@parcel/watcher": "npm:^2.4.1"
+    chokidar: "npm:^5.0.0"
+    immutable: "npm:^5.1.5"
+    source-map-js: "npm:>=0.6.2 <2.0.0"
+  dependenciesMeta:
+    "@parcel/watcher":
+      optional: true
+  bin:
+    sass: sass.js
+  checksum: 10c0/e2aab47c87b69d2d4f8e48fa665138548069f56a7fd0fc4e15c9bde888b715798e49d33436e873918a8849ca3cc6c141a68618f58e2f3b2e6ec179cc309ca622
+  languageName: node
+  linkType: hard
+
 "sax@npm:>=0.6.0, sax@npm:^1.2.4":
   version: 1.4.1
   resolution: "sax@npm:1.4.1"
@@ -52682,6 +53196,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"size-limit@npm:11.2.0, size-limit@npm:^11.1.6":
+  version: 11.2.0
+  resolution: "size-limit@npm:11.2.0"
+  dependencies:
+    bytes-iec: "npm:^3.1.1"
+    chokidar: "npm:^4.0.3"
+    jiti: "npm:^2.4.2"
+    lilconfig: "npm:^3.1.3"
+    nanospinner: "npm:^1.2.2"
+    picocolors: "npm:^1.1.1"
+    tinyglobby: "npm:^0.2.11"
+  bin:
+    size-limit: bin.js
+  checksum: 10c0/c3613e20dfc227074d73098bfdd6fe274aed980bf133ad61a380032425bfa8b7d749c876dea50e9648a64cd57fb768edac9ffc1927100bcadf814255e44236f1
+  languageName: node
+  linkType: hard
+
 "slash@npm:3.0.0, slash@npm:^3.0.0":
   version: 3.0.0
   resolution: "slash@npm:3.0.0"
@@ -52943,7 +53474,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"source-map-js@npm:^1.0.1, source-map-js@npm:^1.0.2, source-map-js@npm:^1.2.0, source-map-js@npm:^1.2.1":
+"source-map-js@npm:>=0.6.2 <2.0.0, source-map-js@npm:^1.0.1, source-map-js@npm:^1.0.2, source-map-js@npm:^1.2.0, source-map-js@npm:^1.2.1":
   version: 1.2.1
   resolution: "source-map-js@npm:1.2.1"
   checksum: 10c0/7bda1fc4c197e3c6ff17de1b8b2c20e60af81b63a52cb32ec5a5d67a20a7d42651e2cb34ebe93833c5a2a084377e17455854fee3e21e7925c64a51b6a52b0faf
@@ -54191,6 +54722,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"sync-child-process@npm:^1.0.2":
+  version: 1.0.2
+  resolution: "sync-child-process@npm:1.0.2"
+  dependencies:
+    sync-message-port: "npm:^1.0.0"
+  checksum: 10c0/f73c87251346fba28da8ac5bc8ed4c9474504a5250ab4bd44582beae8e25c230e0a5b7b16076488fee1aed39a1865de5ed4cec19c6fa4efdbb1081c514615170
+  languageName: node
+  linkType: hard
+
+"sync-message-port@npm:^1.0.0":
+  version: 1.2.0
+  resolution: "sync-message-port@npm:1.2.0"
+  checksum: 10c0/31071ccc1e1607649aab5f1d283b0b6544632b9e8c2e8afedae394a0e97c1454978d0e415d664db8e3b1ae48a9c4cdba8d39e79edcb86c517be06123a110efae
+  languageName: node
+  linkType: hard
+
 "synckit@npm:^0.11.8":
   version: 0.11.11
   resolution: "synckit@npm:0.11.11"
@@ -54662,6 +55209,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tinyglobby@npm:^0.2.11":
+  version: 0.2.17
+  resolution: "tinyglobby@npm:0.2.17"
+  dependencies:
+    fdir: "npm:^6.5.0"
+    picomatch: "npm:^4.0.4"
+  checksum: 10c0/7f7bb0f197c88bc4b20c231e0deca4240ca3bf313a88f5a7fee93a872b84966a4d50220947c0455ad07a60b3b360961c5b7fd979222aeb716a9f99b412002e4c
+  languageName: node
+  linkType: hard
+
 "tinyglobby@npm:^0.2.12, tinyglobby@npm:^0.2.13, tinyglobby@npm:^0.2.14, tinyglobby@npm:^0.2.15":
   version: 0.2.16
   resolution: "tinyglobby@npm:0.2.16"
@@ -55638,6 +56195,66 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"twenty-new-ui@workspace:packages/twenty-new-ui":
+  version: 0.0.0-use.local
+  resolution: "twenty-new-ui@workspace:packages/twenty-new-ui"
+  dependencies:
+    "@argos-ci/storybook": "npm:^6.0.6"
+    "@base-ui/react": "npm:^1.5.0"
+    "@monaco-editor/react": "npm:^4.7.0"
+    "@prettier/sync": "npm:^0.5.2"
+    "@radix-ui/colors": "npm:^3.0.0"
+    "@size-limit/preset-small-lib": "npm:^11.1.6"
+    "@storybook-community/storybook-addon-cookie": "npm:^5.0.0"
+    "@storybook/addon-a11y": "npm:^10.3.3"
+    "@storybook/addon-coverage": "npm:^3.0.0"
+    "@storybook/addon-links": "npm:^10.3.3"
+    "@storybook/addon-vitest": "npm:^10.2.13"
+    "@storybook/react-vite": "npm:^10.3.3"
+    "@swc/core": "npm:^1.15.11"
+    "@swc/jest": "npm:^0.2.39"
+    "@tabler/icons-react": "npm:^3.31.0"
+    "@testing-library/dom": "npm:^10.4.0"
+    "@testing-library/jest-dom": "npm:^6.6.3"
+    "@testing-library/react": "npm:^16.3.0"
+    "@types/jest": "npm:^30.0.0"
+    "@types/react": "npm:^18.2.39"
+    "@types/react-dom": "npm:^18.2.15"
+    "@vitejs/plugin-react-swc": "npm:4.2.3"
+    "@vitest/browser-playwright": "npm:4.0.18"
+    clsx: "npm:^2.1.1"
+    date-fns: "npm:^2.30.0"
+    framer-motion: "npm:^11.18.0"
+    glob: "npm:^11.1.0"
+    hex-rgb: "npm:^5.0.0"
+    jest: "npm:29.7.0"
+    jest-environment-jsdom: "npm:30.0.0-beta.3"
+    jotai: "npm:^2.17.1"
+    prettier: "npm:^3.1.1"
+    react: "npm:^18.2.0"
+    react-dom: "npm:^18.2.0"
+    react-responsive: "npm:^9.0.2"
+    react-router-dom: "npm:^6.4.4"
+    sass: "npm:^1.83.0"
+    sass-embedded: "npm:^1.83.0"
+    size-limit: "npm:^11.1.6"
+    slash: "npm:^5.1.0"
+    storybook-addon-pseudo-states: "npm:^10.3.3"
+    ts-jest: "npm:^29.1.1"
+    tsx: "npm:^4.19.3"
+    twenty-shared: "workspace:*"
+    vite-plugin-checker: "npm:^0.10.2"
+    vite-plugin-dts: "npm:3.8.1"
+    vite-plugin-sass-dts: "npm:^1.3.31"
+    vite-plugin-svgr: "npm:^4.3.0"
+    vite-tsconfig-paths: "npm:^4.2.1"
+    vitest: "npm:4.0.18"
+    zod: "npm:^4.1.11"
+  peerDependencies:
+    monaco-editor: ">= 0.25.0 < 1"
+  languageName: unknown
+  linkType: soft
+
 "twenty-oxlint-rules@workspace:packages/twenty-oxlint-rules":
   version: 0.0.0-use.local
   resolution: "twenty-oxlint-rules@workspace:packages/twenty-oxlint-rules"
@@ -57601,6 +58218,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"varint@npm:^6.0.0":
+  version: 6.0.0
+  resolution: "varint@npm:6.0.0"
+  checksum: 10c0/737fc37088a62ed3bd21466e318d21ca7ac4991d0f25546f518f017703be4ed0f9df1c5559f1dd533dddba4435a1b758fd9230e4772c1a930ef72b42f5c750fd
+  languageName: node
+  linkType: hard
+
 "vary@npm:^1, vary@npm:^1.1.2, vary@npm:~1.1.2":
   version: 1.1.2
   resolution: "vary@npm:1.1.2"
@@ -57873,6 +58497,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vite-plugin-sass-dts@npm:^1.3.31":
+  version: 1.3.37
+  resolution: "vite-plugin-sass-dts@npm:1.3.37"
+  dependencies:
+    postcss-js: "npm:^4.0.1"
+  peerDependencies:
+    postcss: ^8
+    prettier: ^2.7 || ^3
+    sass-embedded: ^1.78.0
+    vite: ^7 || ^8
+  checksum: 10c0/3dab77e2a6a20d471a4d81e55ac55b607f17edb9b03d6cb5871a69f195fad13fb15807267e38cc023a59174c8d1adf3b996f87c33ee4a84848befe4921970edc
+  languageName: node
+  linkType: hard
+
 "vite-plugin-svgr@npm:^4.3.0":
   version: 4.5.0
   resolution: "vite-plugin-svgr@npm:4.5.0"
@@ -57957,7 +58595,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vitest@npm:^4.0.18":
+"vitest@npm:4.0.18, vitest@npm:^4.0.18":
   version: 4.0.18
   resolution: "vitest@npm:4.0.18"
   dependencies: