diff --git a/src/effects/ChromaticAberration.tsx b/src/effects/ChromaticAberration.tsx
index cfd961c..0ef9594 100644
--- a/src/effects/ChromaticAberration.tsx
+++ b/src/effects/ChromaticAberration.tsx
@@ -1,19 +1,5 @@
-import React, { Ref, forwardRef, useMemo } from 'react'
 import { ChromaticAberrationEffect } from 'postprocessing'
-import { ReactThreeFiber } from '@react-three/fiber'
-import { useVector2 } from '../util'
+import { type EffectProps, wrapEffect } from '../util'
 
-// type for function args should use constructor args
-export type ChromaticAberrationProps = ConstructorParameters<typeof ChromaticAberrationEffect>[0] &
-  Partial<{
-    offset: ReactThreeFiber.Vector2
-  }>
-
-export const ChromaticAberration = forwardRef(function ChromaticAberration(
-  props: ChromaticAberrationProps,
-  ref: Ref<ChromaticAberrationEffect>
-) {
-  const offset = useVector2(props, 'offset')
-  const effect = useMemo(() => new ChromaticAberrationEffect({ ...props, offset }), [offset, props])
-  return <primitive ref={ref} object={effect} dispose={null} />
-})
+export type ChromaticAberrationProps = EffectProps<typeof ChromaticAberrationEffect>
+export const ChromaticAberration = wrapEffect(ChromaticAberrationEffect)