:root:has(input.theme-controller[value=yami]:checked),[data-theme="yami"] { /* mytheme is the name of the custom theme */
  color-scheme: dark;
  /* --color-base-100: oklch(24.354% 0.00003 271.152); */
  /* ...rest of CSS variables like above example */
}
:root:has(input.theme-controller[value=nord]:checked),[data-theme="nord"] { /* mytheme is the name of the custom theme */
  color-scheme: light;
  --color-base-100: oklch(0.9513 0.0074 260.73);
  --color-base-200: oklch(0.933 0.0104 261.79);
  --color-base-300: oklch(0.8993 0.0164 262.75);
  --color-base-content: oklch(0.3244 0.0229 264.18);
  --color-primary: oklch(0.5944 0.0772 254.03);
  --color-primary-content: oklch(98% 0.01 240);
  --color-secondary: oklch(0.6965 0.0591 248.69);
  --color-secondary-content: oklch(98% 0.01 200);
  --color-accent: oklch(0.7746 0.0622 217.47);
  --color-accent-content: oklch(98% 0.01 160);
  --color-neutral: oklch(0.7629 0.0477 194.49);
  --color-neutral-content: oklch(98% 0.01 240);
  --color-info: oklch(70% 0.2 220);
  --color-info-content: oklch(98% 0.01 220);
  --color-success: oklch(0.7683 0.0749 131.06);
  --color-success-content: oklch(98% 0.01 140);
  --color-warning: oklch(0.8549 0.0892 84.09);
  --color-warning-content: oklch(0.3244 0.0229 264.18);
  --color-error: oklch(0.6061 0.1206 15.34);
  --color-error-content: oklch(98% 0.01 30);

  /* border radius */
  --radius-selector: 1rem;
  --radius-field: 0.25rem;
  --radius-box: 0.5rem;

  /* base sizes */
  --size-selector: 0.25rem;
  --size-field: 0.25rem;

  /* border size */
  --border: 1px;

  /* effects */
  --depth: 1;
  --noise: 0;
}

html {
  scroll-behavior: smooth;
}