@kilivi/payloadcms-theme-management 2.0.0 → 2.1.0

package/dist/extended-themes.js

@@ -1081,6 +1081,434 @@
             input: '#202020',
             ring: '#cecece'
         }
+    },
+    // ─── Special effect presets (from TweakCN) ────────────────────────────────
+    {
+        name: 'glassmorphism',
+        label: 'Glassmorphism',
+        borderRadius: 'large',
+        visualEffects: {
+            effectStyle: 'glass',
+            backdropBlur: 'strong',
+            shadowIntensity: 'subtle',
+            borderStyle: 'solid',
+            borderWidth: '1px',
+            glassOpacity: 60
+        },
+        lightMode: {
+            background: 'oklch(0.97 0.015 230)',
+            foreground: 'oklch(0.22 0.05 240)',
+            card: 'oklch(1 0 0 / 60%)',
+            cardForeground: 'oklch(0.22 0.05 240)',
+            popover: 'oklch(1 0 0 / 80%)',
+            popoverForeground: 'oklch(0.22 0.05 240)',
+            primary: 'oklch(0.60 0.18 250)',
+            primaryForeground: 'oklch(0.97 0.01 250)',
+            secondary: 'oklch(1 0 0 / 40%)',
+            secondaryForeground: 'oklch(0.22 0.05 240)',
+            muted: 'oklch(0.92 0.02 230)',
+            mutedForeground: 'oklch(0.52 0.07 240)',
+            accent: 'oklch(0.72 0.15 190)',
+            accentForeground: 'oklch(0.97 0.01 190)',
+            destructive: 'oklch(0.58 0.22 25)',
+            destructiveForeground: 'oklch(0.97 0.01 25)',
+            border: 'oklch(1 0 0 / 30%)',
+            input: 'oklch(1 0 0 / 50%)',
+            ring: 'oklch(0.60 0.18 250)'
+        },
+        darkMode: {
+            background: 'oklch(0.12 0.03 250)',
+            foreground: 'oklch(0.95 0.02 240)',
+            card: 'oklch(1 0 0 / 8%)',
+            cardForeground: 'oklch(0.95 0.02 240)',
+            popover: 'oklch(1 0 0 / 12%)',
+            popoverForeground: 'oklch(0.95 0.02 240)',
+            primary: 'oklch(0.70 0.20 250)',
+            primaryForeground: 'oklch(0.12 0.03 250)',
+            secondary: 'oklch(1 0 0 / 10%)',
+            secondaryForeground: 'oklch(0.95 0.02 240)',
+            muted: 'oklch(1 0 0 / 8%)',
+            mutedForeground: 'oklch(0.70 0.05 240)',
+            accent: 'oklch(0.65 0.17 190)',
+            accentForeground: 'oklch(0.95 0.02 190)',
+            destructive: 'oklch(0.68 0.24 25)',
+            destructiveForeground: 'oklch(0.95 0.02 25)',
+            border: 'oklch(1 0 0 / 12%)',
+            input: 'oklch(1 0 0 / 15%)',
+            ring: 'oklch(0.70 0.20 250)'
+        }
+    },
+    {
+        name: 'claymorphism',
+        label: 'Claymorphism',
+        borderRadius: 'xl',
+        visualEffects: {
+            effectStyle: 'clay',
+            shadowIntensity: 'strong',
+            backdropBlur: 'none',
+            borderStyle: 'solid',
+            borderWidth: '1px'
+        },
+        lightMode: {
+            background: 'oklch(0.96 0.02 200)',
+            foreground: 'oklch(0.25 0.04 220)',
+            card: 'oklch(0.99 0.01 200)',
+            cardForeground: 'oklch(0.25 0.04 220)',
+            popover: 'oklch(0.99 0.01 200)',
+            popoverForeground: 'oklch(0.25 0.04 220)',
+            primary: 'oklch(0.65 0.20 255)',
+            primaryForeground: 'oklch(0.98 0.01 255)',
+            secondary: 'oklch(0.88 0.07 160)',
+            secondaryForeground: 'oklch(0.25 0.04 160)',
+            muted: 'oklch(0.92 0.03 200)',
+            mutedForeground: 'oklch(0.52 0.06 220)',
+            accent: 'oklch(0.80 0.12 40)',
+            accentForeground: 'oklch(0.25 0.04 40)',
+            destructive: 'oklch(0.62 0.22 25)',
+            destructiveForeground: 'oklch(0.98 0.01 25)',
+            border: 'oklch(0.88 0.04 200)',
+            input: 'oklch(0.95 0.02 200)',
+            ring: 'oklch(0.65 0.20 255)'
+        },
+        darkMode: {
+            background: 'oklch(0.18 0.03 230)',
+            foreground: 'oklch(0.94 0.02 220)',
+            card: 'oklch(0.24 0.04 230)',
+            cardForeground: 'oklch(0.94 0.02 220)',
+            popover: 'oklch(0.24 0.04 230)',
+            popoverForeground: 'oklch(0.94 0.02 220)',
+            primary: 'oklch(0.72 0.22 255)',
+            primaryForeground: 'oklch(0.18 0.03 255)',
+            secondary: 'oklch(0.35 0.08 160)',
+            secondaryForeground: 'oklch(0.94 0.02 160)',
+            muted: 'oklch(0.28 0.05 230)',
+            mutedForeground: 'oklch(0.70 0.06 220)',
+            accent: 'oklch(0.65 0.14 40)',
+            accentForeground: 'oklch(0.94 0.02 40)',
+            destructive: 'oklch(0.70 0.24 25)',
+            destructiveForeground: 'oklch(0.18 0.03 25)',
+            border: 'oklch(0.34 0.06 230)',
+            input: 'oklch(0.34 0.06 230)',
+            ring: 'oklch(0.72 0.22 255)'
+        }
+    },
+    {
+        name: 'neumorphism',
+        label: 'Neumorphism Soft UI',
+        borderRadius: 'large',
+        visualEffects: {
+            effectStyle: 'neumorphic',
+            shadowIntensity: 'strong',
+            backdropBlur: 'none',
+            borderStyle: 'none',
+            borderWidth: '0px'
+        },
+        lightMode: {
+            background: 'oklch(0.93 0.01 240)',
+            foreground: 'oklch(0.30 0.03 240)',
+            card: 'oklch(0.93 0.01 240)',
+            cardForeground: 'oklch(0.30 0.03 240)',
+            popover: 'oklch(0.95 0.01 240)',
+            popoverForeground: 'oklch(0.30 0.03 240)',
+            primary: 'oklch(0.60 0.16 250)',
+            primaryForeground: 'oklch(0.93 0.01 250)',
+            secondary: 'oklch(0.90 0.01 240)',
+            secondaryForeground: 'oklch(0.30 0.03 240)',
+            muted: 'oklch(0.90 0.01 240)',
+            mutedForeground: 'oklch(0.55 0.04 240)',
+            accent: 'oklch(0.68 0.14 215)',
+            accentForeground: 'oklch(0.93 0.01 215)',
+            destructive: 'oklch(0.60 0.20 25)',
+            destructiveForeground: 'oklch(0.93 0.01 25)',
+            border: 'oklch(0.88 0.02 240)',
+            input: 'oklch(0.90 0.01 240)',
+            ring: 'oklch(0.60 0.16 250)'
+        },
+        darkMode: {
+            background: 'oklch(0.22 0.03 240)',
+            foreground: 'oklch(0.88 0.02 240)',
+            card: 'oklch(0.22 0.03 240)',
+            cardForeground: 'oklch(0.88 0.02 240)',
+            popover: 'oklch(0.25 0.03 240)',
+            popoverForeground: 'oklch(0.88 0.02 240)',
+            primary: 'oklch(0.68 0.18 250)',
+            primaryForeground: 'oklch(0.22 0.03 250)',
+            secondary: 'oklch(0.28 0.03 240)',
+            secondaryForeground: 'oklch(0.88 0.02 240)',
+            muted: 'oklch(0.26 0.03 240)',
+            mutedForeground: 'oklch(0.65 0.04 240)',
+            accent: 'oklch(0.62 0.16 215)',
+            accentForeground: 'oklch(0.88 0.02 215)',
+            destructive: 'oklch(0.66 0.22 25)',
+            destructiveForeground: 'oklch(0.22 0.03 25)',
+            border: 'oklch(0.30 0.04 240)',
+            input: 'oklch(0.28 0.03 240)',
+            ring: 'oklch(0.68 0.18 250)'
+        }
+    },
+    {
+        name: 'aurora',
+        label: 'Aurora Borealis',
+        borderRadius: 'large',
+        visualEffects: {
+            effectStyle: 'glass',
+            backdropBlur: 'medium',
+            shadowIntensity: 'subtle'
+        },
+        lightMode: {
+            background: 'oklch(0.97 0.02 175)',
+            foreground: 'oklch(0.18 0.06 200)',
+            card: 'oklch(0.95 0.03 170)',
+            cardForeground: 'oklch(0.18 0.06 200)',
+            popover: 'oklch(0.95 0.03 170)',
+            popoverForeground: 'oklch(0.18 0.06 200)',
+            primary: 'oklch(0.62 0.18 175)',
+            primaryForeground: 'oklch(0.97 0.01 175)',
+            secondary: 'oklch(0.88 0.08 300)',
+            secondaryForeground: 'oklch(0.18 0.06 300)',
+            muted: 'oklch(0.91 0.04 175)',
+            mutedForeground: 'oklch(0.50 0.08 200)',
+            accent: 'oklch(0.72 0.16 300)',
+            accentForeground: 'oklch(0.97 0.01 300)',
+            destructive: 'oklch(0.58 0.22 25)',
+            destructiveForeground: 'oklch(0.97 0.01 25)',
+            border: 'oklch(0.86 0.05 175)',
+            input: 'oklch(0.86 0.05 175)',
+            ring: 'oklch(0.62 0.18 175)'
+        },
+        darkMode: {
+            background: 'oklch(0.10 0.04 230)',
+            foreground: 'oklch(0.95 0.03 180)',
+            card: 'oklch(0.14 0.05 225)',
+            cardForeground: 'oklch(0.95 0.03 180)',
+            popover: 'oklch(0.14 0.05 225)',
+            popoverForeground: 'oklch(0.95 0.03 180)',
+            primary: 'oklch(0.75 0.22 175)',
+            primaryForeground: 'oklch(0.10 0.04 175)',
+            secondary: 'oklch(0.28 0.10 300)',
+            secondaryForeground: 'oklch(0.95 0.03 300)',
+            muted: 'oklch(0.20 0.07 225)',
+            mutedForeground: 'oklch(0.68 0.08 180)',
+            accent: 'oklch(0.68 0.20 300)',
+            accentForeground: 'oklch(0.10 0.04 300)',
+            destructive: 'oklch(0.68 0.24 25)',
+            destructiveForeground: 'oklch(0.10 0.04 25)',
+            border: 'oklch(0.28 0.08 225)',
+            input: 'oklch(0.28 0.08 225)',
+            ring: 'oklch(0.75 0.22 175)'
+        }
+    },
+    {
+        name: 'luxury',
+        label: 'Luxury Gold',
+        borderRadius: 'small',
+        visualEffects: {
+            effectStyle: 'elevated',
+            shadowIntensity: 'medium',
+            borderStyle: 'solid',
+            borderWidth: '1px'
+        },
+        lightMode: {
+            background: 'oklch(0.98 0.01 80)',
+            foreground: 'oklch(0.15 0.03 60)',
+            card: 'oklch(0.96 0.02 75)',
+            cardForeground: 'oklch(0.15 0.03 60)',
+            popover: 'oklch(0.96 0.02 75)',
+            popoverForeground: 'oklch(0.15 0.03 60)',
+            primary: 'oklch(0.72 0.14 75)',
+            primaryForeground: 'oklch(0.15 0.03 75)',
+            secondary: 'oklch(0.92 0.04 80)',
+            secondaryForeground: 'oklch(0.15 0.03 80)',
+            muted: 'oklch(0.94 0.02 75)',
+            mutedForeground: 'oklch(0.48 0.06 60)',
+            accent: 'oklch(0.62 0.18 55)',
+            accentForeground: 'oklch(0.98 0.01 55)',
+            destructive: 'oklch(0.55 0.22 25)',
+            destructiveForeground: 'oklch(0.98 0.01 25)',
+            border: 'oklch(0.88 0.05 75)',
+            input: 'oklch(0.90 0.03 75)',
+            ring: 'oklch(0.72 0.14 75)'
+        },
+        darkMode: {
+            background: 'oklch(0.10 0.02 60)',
+            foreground: 'oklch(0.90 0.05 80)',
+            card: 'oklch(0.14 0.03 65)',
+            cardForeground: 'oklch(0.90 0.05 80)',
+            popover: 'oklch(0.14 0.03 65)',
+            popoverForeground: 'oklch(0.90 0.05 80)',
+            primary: 'oklch(0.78 0.16 75)',
+            primaryForeground: 'oklch(0.10 0.02 75)',
+            secondary: 'oklch(0.24 0.06 65)',
+            secondaryForeground: 'oklch(0.90 0.05 80)',
+            muted: 'oklch(0.20 0.04 65)',
+            mutedForeground: 'oklch(0.65 0.08 80)',
+            accent: 'oklch(0.68 0.20 55)',
+            accentForeground: 'oklch(0.10 0.02 55)',
+            destructive: 'oklch(0.65 0.24 25)',
+            destructiveForeground: 'oklch(0.10 0.02 25)',
+            border: 'oklch(0.30 0.06 65)',
+            input: 'oklch(0.28 0.05 65)',
+            ring: 'oklch(0.78 0.16 75)'
+        }
+    },
+    {
+        name: 'healthcare',
+        label: 'Healthcare Clean',
+        borderRadius: 'medium',
+        visualEffects: {
+            effectStyle: 'flat',
+            shadowIntensity: 'subtle',
+            borderStyle: 'solid',
+            borderWidth: '1px'
+        },
+        lightMode: {
+            background: 'oklch(0.99 0.005 210)',
+            foreground: 'oklch(0.20 0.04 215)',
+            card: 'oklch(1 0 0)',
+            cardForeground: 'oklch(0.20 0.04 215)',
+            popover: 'oklch(1 0 0)',
+            popoverForeground: 'oklch(0.20 0.04 215)',
+            primary: 'oklch(0.55 0.16 218)',
+            primaryForeground: 'oklch(0.99 0.005 218)',
+            secondary: 'oklch(0.92 0.04 200)',
+            secondaryForeground: 'oklch(0.20 0.04 200)',
+            muted: 'oklch(0.95 0.02 210)',
+            mutedForeground: 'oklch(0.52 0.06 215)',
+            accent: 'oklch(0.68 0.14 170)',
+            accentForeground: 'oklch(0.99 0.005 170)',
+            destructive: 'oklch(0.57 0.22 25)',
+            destructiveForeground: 'oklch(0.99 0.005 25)',
+            border: 'oklch(0.90 0.03 210)',
+            input: 'oklch(0.93 0.02 210)',
+            ring: 'oklch(0.55 0.16 218)'
+        },
+        darkMode: {
+            background: 'oklch(0.14 0.03 215)',
+            foreground: 'oklch(0.94 0.02 215)',
+            card: 'oklch(0.18 0.04 215)',
+            cardForeground: 'oklch(0.94 0.02 215)',
+            popover: 'oklch(0.18 0.04 215)',
+            popoverForeground: 'oklch(0.94 0.02 215)',
+            primary: 'oklch(0.68 0.18 218)',
+            primaryForeground: 'oklch(0.14 0.03 218)',
+            secondary: 'oklch(0.28 0.07 200)',
+            secondaryForeground: 'oklch(0.94 0.02 200)',
+            muted: 'oklch(0.24 0.05 215)',
+            mutedForeground: 'oklch(0.68 0.07 215)',
+            accent: 'oklch(0.62 0.16 170)',
+            accentForeground: 'oklch(0.14 0.03 170)',
+            destructive: 'oklch(0.66 0.24 25)',
+            destructiveForeground: 'oklch(0.14 0.03 25)',
+            border: 'oklch(0.30 0.05 215)',
+            input: 'oklch(0.30 0.05 215)',
+            ring: 'oklch(0.68 0.18 218)'
+        }
+    },
+    {
+        name: 'nordic',
+        label: 'Nordic Minimal',
+        borderRadius: 'small',
+        visualEffects: {
+            effectStyle: 'flat',
+            shadowIntensity: 'subtle',
+            borderStyle: 'solid',
+            borderWidth: '1px'
+        },
+        lightMode: {
+            background: 'oklch(0.97 0.01 220)',
+            foreground: 'oklch(0.18 0.03 225)',
+            card: 'oklch(0.99 0.005 215)',
+            cardForeground: 'oklch(0.18 0.03 225)',
+            popover: 'oklch(0.99 0.005 215)',
+            popoverForeground: 'oklch(0.18 0.03 225)',
+            primary: 'oklch(0.42 0.10 225)',
+            primaryForeground: 'oklch(0.97 0.01 225)',
+            secondary: 'oklch(0.88 0.03 220)',
+            secondaryForeground: 'oklch(0.18 0.03 220)',
+            muted: 'oklch(0.92 0.02 220)',
+            mutedForeground: 'oklch(0.52 0.05 225)',
+            accent: 'oklch(0.65 0.10 195)',
+            accentForeground: 'oklch(0.97 0.01 195)',
+            destructive: 'oklch(0.55 0.20 25)',
+            destructiveForeground: 'oklch(0.97 0.01 25)',
+            border: 'oklch(0.86 0.03 220)',
+            input: 'oklch(0.89 0.02 220)',
+            ring: 'oklch(0.42 0.10 225)'
+        },
+        darkMode: {
+            background: 'oklch(0.16 0.02 225)',
+            foreground: 'oklch(0.92 0.02 220)',
+            card: 'oklch(0.20 0.03 222)',
+            cardForeground: 'oklch(0.92 0.02 220)',
+            popover: 'oklch(0.20 0.03 222)',
+            popoverForeground: 'oklch(0.92 0.02 220)',
+            primary: 'oklch(0.68 0.12 225)',
+            primaryForeground: 'oklch(0.16 0.02 225)',
+            secondary: 'oklch(0.28 0.04 220)',
+            secondaryForeground: 'oklch(0.92 0.02 220)',
+            muted: 'oklch(0.24 0.03 222)',
+            mutedForeground: 'oklch(0.65 0.05 225)',
+            accent: 'oklch(0.58 0.12 195)',
+            accentForeground: 'oklch(0.92 0.02 195)',
+            destructive: 'oklch(0.65 0.22 25)',
+            destructiveForeground: 'oklch(0.16 0.02 25)',
+            border: 'oklch(0.30 0.04 222)',
+            input: 'oklch(0.28 0.03 222)',
+            ring: 'oklch(0.68 0.12 225)'
+        }
+    },
+    {
+        name: 'warm-earth',
+        label: 'Warm Earth Tones',
+        borderRadius: 'medium',
+        visualEffects: {
+            effectStyle: 'elevated',
+            shadowIntensity: 'medium',
+            borderStyle: 'solid',
+            borderWidth: '1px'
+        },
+        lightMode: {
+            background: 'oklch(0.97 0.025 75)',
+            foreground: 'oklch(0.22 0.05 50)',
+            card: 'oklch(0.95 0.03 70)',
+            cardForeground: 'oklch(0.22 0.05 50)',
+            popover: 'oklch(0.95 0.03 70)',
+            popoverForeground: 'oklch(0.22 0.05 50)',
+            primary: 'oklch(0.52 0.12 50)',
+            primaryForeground: 'oklch(0.97 0.01 50)',
+            secondary: 'oklch(0.88 0.07 85)',
+            secondaryForeground: 'oklch(0.22 0.05 85)',
+            muted: 'oklch(0.91 0.04 75)',
+            mutedForeground: 'oklch(0.50 0.08 55)',
+            accent: 'oklch(0.68 0.14 145)',
+            accentForeground: 'oklch(0.97 0.01 145)',
+            destructive: 'oklch(0.57 0.22 25)',
+            destructiveForeground: 'oklch(0.97 0.01 25)',
+            border: 'oklch(0.86 0.05 70)',
+            input: 'oklch(0.88 0.04 75)',
+            ring: 'oklch(0.52 0.12 50)'
+        },
+        darkMode: {
+            background: 'oklch(0.16 0.04 50)',
+            foreground: 'oklch(0.93 0.03 75)',
+            card: 'oklch(0.20 0.05 55)',
+            cardForeground: 'oklch(0.93 0.03 75)',
+            popover: 'oklch(0.20 0.05 55)',
+            popoverForeground: 'oklch(0.93 0.03 75)',
+            primary: 'oklch(0.68 0.14 50)',
+            primaryForeground: 'oklch(0.16 0.04 50)',
+            secondary: 'oklch(0.30 0.08 85)',
+            secondaryForeground: 'oklch(0.93 0.03 85)',
+            muted: 'oklch(0.25 0.06 55)',
+            mutedForeground: 'oklch(0.68 0.08 75)',
+            accent: 'oklch(0.60 0.16 145)',
+            accentForeground: 'oklch(0.16 0.04 145)',
+            destructive: 'oklch(0.66 0.24 25)',
+            destructiveForeground: 'oklch(0.16 0.04 25)',
+            border: 'oklch(0.32 0.07 55)',
+            input: 'oklch(0.32 0.07 55)',
+            ring: 'oklch(0.68 0.14 50)'
+        }
     }
 ];