diff --git a/apps/theme/app/globals.css b/apps/theme/app/globals.css
index e49650529b..c2a5248be8 100644
--- a/apps/theme/app/globals.css
+++ b/apps/theme/app/globals.css
@@ -35,6 +35,8 @@ code {
   --ds-color-accent-base-default: #740c7e;
   --ds-color-accent-text-subtle: #93429b;
   --ds-color-base-default: #740c7e;
+  --ds-color-base-hover: #872d90;
+  --ds-color-base-active: #97499f;
   --ds-color-accent-surface-default: #ecdded;
   --ds-color-accent-surface-hover: #e0cae3;
   --ds-color-accent-surface-active: #d6b7d9;
@@ -47,6 +49,8 @@ code {
   --ds-color-accent-base-default: #c79dcb;
   --ds-color-accent-text-subtle: #c294c6;
   --ds-color-base-default: #c79dcb;
+  --ds-color-base-hover: #b884be;
+  --ds-color-base-active: #aa6ab0;
   --ds-color-accent-surface-default: #56095e;
   --ds-color-accent-surface-hover: #6c0b75;
   --ds-color-accent-surface-active: #7e1e87;
diff --git a/apps/theme/app/page.tsx b/apps/theme/app/page.tsx
index b2b50d6409..631bc8344d 100644
--- a/apps/theme/app/page.tsx
+++ b/apps/theme/app/page.tsx
@@ -33,8 +33,7 @@ export default function Home() {
   const pathname = usePathname();
   const params = new URLSearchParams(searchParams);
   const colorModalRef = useRef<HTMLDialogElement>(null);
-  const addColor = useThemeStore((state) => state.addColor);
-  const resetColors = useThemeStore((state) => state.resetColors);
+  const setPreviewTheme = useThemeStore((state) => state.setThemePreview);
 
   useEffect(() => {
     // Open modal on selected color change
@@ -177,7 +176,10 @@ export default function Home() {
             </Paragraph>
             <div className={classes.btnGroup}>
               <Button data-color='neutral' asChild>
-                <NextLink href='/welcome'>
+                <NextLink
+                  href='/welcome'
+                  onClick={() => setPreviewTheme('one')}
+                >
                   <PaletteIcon title='a11y-title' fontSize='1.5rem' />
                   Bygg tema
                 </NextLink>