diff --git a/lib/client/vanilla/editor.tsx b/lib/client/vanilla/editor.tsx
index 8c7e3dce..d2ba20b1 100644
--- a/lib/client/vanilla/editor.tsx
+++ b/lib/client/vanilla/editor.tsx
@@ -102,7 +102,7 @@ const Category: React.FC<CategoryProps> = ({ themeIndex, category, components, s
         <div className="flex-1 flex items-center">
           <Squares2X2Icon className="h-4 w-4 ml-2 mr-4" /> <h2 className="text-xs uppercase">{category}</h2>
         </div>
-        <a style={{ transform: `rotate(${show ? 180 : 0}deg)` }}>
+        <a className="rotate-animation" style={{ transform: `rotate(${show ? 180 : 0}deg)` }}>
           <ArrowSmallUpIcon className="h-4 w-4" />
         </a>
       </div>
diff --git a/lib/client/vanilla/index.css b/lib/client/vanilla/index.css
index 206bd7d9..1393df77 100644
--- a/lib/client/vanilla/index.css
+++ b/lib/client/vanilla/index.css
@@ -6,3 +6,8 @@
   transition-timing-function: ease-in;
   transition: 0.2s cubic-bezier(0.2, 1, 0.2, 1);
 }
+
+.rotate-animation {
+  transition-timing-function: linear;
+  transition: 0.2s;
+}