diff --git a/packages/gui/src/components/schemas/color.ts b/packages/gui/src/components/schemas/color.ts
index 51bf3a6e..4d995daa 100644
--- a/packages/gui/src/components/schemas/color.ts
+++ b/packages/gui/src/components/schemas/color.ts
@@ -81,6 +81,13 @@ export function color({
       keyword(['currentcolor', 'transparent'], { type: 'system' }),
       themeColor,
     ],
-    { defaultValue }
+    {
+      defaultValue,
+      convert: (a) => {
+        console.log(a)
+        console.log('!!!!!!!!!')
+        return defaultValue
+      },
+    }
   )
 }
diff --git a/packages/gui/src/components/schemas/joinSchemas.tsx b/packages/gui/src/components/schemas/joinSchemas.tsx
index 50db79e8..a5bcea9b 100644
--- a/packages/gui/src/components/schemas/joinSchemas.tsx
+++ b/packages/gui/src/components/schemas/joinSchemas.tsx
@@ -21,6 +21,7 @@ export function joinSchemas<S extends DataTypeSchema<any>>(
       variants = { ...variants, [variant.type]: variant }
     }
   }
+
   // TODO Keep conversion functions from sub-variants
   // if a `convert` function is defined, it is not propagated to the joined schema right now
   return optionsSchema({
diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx
index e02d55d0..2846b172 100644
--- a/packages/gui/src/components/schemas/options.tsx
+++ b/packages/gui/src/components/schemas/options.tsx
@@ -42,8 +42,15 @@ export function optionsSchema<T extends Record<string, any>>({
     return newValue ?? previousValue
   }
 
+  let color = false
+  if (convert && String(convert).includes('!!!')) {
+    color = true
+    console.log(convert)
+  }
+
   return {
     type,
+    convert: convert as any,
     variants: variants as any,
     inlineInput(props) {
       const type = getType(props.value)
diff --git a/packages/gui/src/components/schemas/responsive.tsx b/packages/gui/src/components/schemas/responsive.tsx
index 6530934b..d2411d06 100644
--- a/packages/gui/src/components/schemas/responsive.tsx
+++ b/packages/gui/src/components/schemas/responsive.tsx
@@ -48,6 +48,7 @@ export function responsive<T>(
         ),
       }
     },
+    convert: itemSchema.convert,
     stringify(value, ...args) {
       return (value as any).values.map((val: T) =>
         itemSchema.stringify(val, ...args)
diff --git a/packages/gui/src/components/schemas/topLevel.ts b/packages/gui/src/components/schemas/topLevel.ts
index 83d8122c..fa6414db 100644
--- a/packages/gui/src/components/schemas/topLevel.ts
+++ b/packages/gui/src/components/schemas/topLevel.ts
@@ -14,14 +14,27 @@ export function topLevel<T>(schema: DataTypeSchema<T>, property: string) {
   const responsiveInput = responsive(withGlobal)
   return joinSchemas([withGlobal, responsiveInput], {
     convert(oldValue, newType) {
+      console.log(schema)
       // If converting *from* a responsive input, take the first value
       if (responsiveInput.validate(oldValue)) {
-        return oldValue.values[0] as any
+        const newValue = oldValue.values[0] as any
+        console.log('sch conv', oldValue, newType, schema.convert)
+        if (!schema.convert) {
+          return newValue
+        }
+
+        console.log('CONVERTING!!!')
+        return schema.convert(newValue, newType as any)
       }
       // If converting *to* a responsive input, triplicate the current input
       if (newType === 'responsive') {
         return { type: 'responsive', values: [oldValue, oldValue, oldValue] }
       }
+
+      if (schema.convert) {
+        return schema.convert(oldValue as T, newType as any)
+      }
+
       return undefined
     },
   })
diff --git a/packages/gui/src/components/schemas/types.ts b/packages/gui/src/components/schemas/types.ts
index 8d414129..cc3256a1 100644
--- a/packages/gui/src/components/schemas/types.ts
+++ b/packages/gui/src/components/schemas/types.ts
@@ -29,6 +29,8 @@ export interface DataTypeSchema<T> {
    *  - the rest of the unparsed tokens
    */
   parse?(tokens: Token[]): [result: T | undefined, rest: Token[]]
+  /** Optional conversion function to transform an old value to its new type */
+  convert?(oldValue: T, newType: keyof T): T | undefined
 }
 
 export interface RegenOptions<T> {
@@ -39,3 +41,4 @@ export interface RegenOptions<T> {
 }
 
 export type SchemaVariants<T> = { [V in keyof T]: DataTypeSchema<T[V]> }
+type Unionize<T> = { [K in keyof T]: T[K] }[keyof T]
diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts
index 0216be7f..ccb1d010 100644
--- a/packages/gui/src/data/properties.ts
+++ b/packages/gui/src/data/properties.ts
@@ -129,7 +129,7 @@ function normalizeSchema(propertyData: PropertyData): DataTypeSchema<any> {
           keywords && keyword(keywords),
           themeProperty && themeSchema(themeProperty),
         ]),
-        { defaultValue: propertyData.defaultValue }
+        { defaultValue: propertyData.defaultValue, convert: schema.convert }
       )
     }
   }