diff --git a/packages/pillar-core/src/core/avatar/avatar.type.ts b/packages/pillar-core/src/core/avatar/avatar.type.ts
index 45e7e6fd..da46e394 100644
--- a/packages/pillar-core/src/core/avatar/avatar.type.ts
+++ b/packages/pillar-core/src/core/avatar/avatar.type.ts
@@ -1,7 +1,7 @@
 import { ReactElement, ReactNode } from 'react'
 import type { Color, Corner, CornerBlob, CornerHand, Size, Variant } from '../../types'
 
-type Animate = 'zoom' | 'jump-y' | 'jump-x'
+type Animate = 'zoom' | 'jump-y' | 'jump-x' | 'jump--y' | 'jump--x' | 'zoom-in'
 
 interface AvatarBase {
   size?: Size
@@ -14,7 +14,7 @@ interface AvatarBase {
 
 export interface AvatarProps extends AvatarBase {
   title?: string
-  image?: string
+  src?: string
 }
 
 export interface AvatarGroupProps extends AvatarBase {
diff --git a/packages/pillar-core/src/core/avatar/index.tsx b/packages/pillar-core/src/core/avatar/index.tsx
index 2b1800d6..8e1d70d0 100644
--- a/packages/pillar-core/src/core/avatar/index.tsx
+++ b/packages/pillar-core/src/core/avatar/index.tsx
@@ -69,14 +69,14 @@ export const Avatar = forwardRef((props, forwardRef) => {
     corner = ctx?.corner,
     color = ctx?.color ?? 'p',
     fallback = ctx?.fallback ?? <User strokeWidth="1.5" width="max(1.5em, 10px)" />,
-    image = '',
+    src = '',
     className,
     title,
     onError,
     ...rest
   } = props
 
-  const [isError, setIsError] = useState(!image)
+  const [isError, setIsError] = useState(!src)
 
   const classNames = cx(`av- av-${variant} C-${color} S-e F-c`, {
     [`A-${animate}`]: animate,
@@ -93,7 +93,7 @@ export const Avatar = forwardRef((props, forwardRef) => {
       className="av-I"
       ref={(node) => {
         if (node) {
-          node.src = image
+          node.src = src
           node.onerror = () => {
             setIsError(true)
           }
diff --git a/packages/pillar-core/src/core/skeleton/index.tsx b/packages/pillar-core/src/core/skeleton/index.tsx
index e6efa5a2..d5831bea 100644
--- a/packages/pillar-core/src/core/skeleton/index.tsx
+++ b/packages/pillar-core/src/core/skeleton/index.tsx
@@ -78,7 +78,7 @@ SkeletonButton.displayName = 'SkeletonButton'
 */
 
 export const Skeleton = forwardRef((props, ref) => {
-  const { height, as: Tag = 'div', className, isLoading, children, ...rest } = props
+  const { height, as: Tag = 'div', className = '', isLoading, children, ...rest } = props
 
   const classNames = cx(`sk- sk-B ${className}`, { [`Sh-${height}`]: height })
 
diff --git a/packages/pillar-core/src/css/utilities/_animation.css b/packages/pillar-core/src/css/utilities/_animation.css
index 27366a0d..928f8822 100644
--- a/packages/pillar-core/src/css/utilities/_animation.css
+++ b/packages/pillar-core/src/css/utilities/_animation.css
@@ -1,6 +1,9 @@
 .A-zoom,
 .A-jump-x,
-.A-jump-y {
+.A-jump--x,
+.A-jump-y,
+.A-jump--y,
+.A-zoom-in {
   transition: transform 0.3s;
 }
 
@@ -8,8 +11,17 @@
   transform: scale(1.1);
 }
 .A-jump-y:hover {
-  transform: translateY(2px);
+  transform: translateY(3px);
 }
 .A-jump-x:hover {
-  transform: translateX(2px);
+  transform: translateX(3px);
+}
+.A-jump--x:hover {
+  transform: translateX(-3px);
+}
+.A-jump--y:hover {
+  transform: translateY(-3px);
+}
+.A-zoom-in:hover {
+  transform: scale(0.9);
 }