diff --git a/.changeset/nice-balloons-flash.md b/.changeset/nice-balloons-flash.md
new file mode 100644
index 00000000000..0bdc27f8f8d
--- /dev/null
+++ b/.changeset/nice-balloons-flash.md
@@ -0,0 +1,5 @@
+---
+'@talend/design-system': minor
+---
+
+chore: changed skeleton "sized" variant width and height props to strings
diff --git a/packages/design-system/src/components/Skeleton/variations/SkeletonSized.tsx b/packages/design-system/src/components/Skeleton/variations/SkeletonSized.tsx
index 1146568b0dd..36313cabae3 100644
--- a/packages/design-system/src/components/Skeleton/variations/SkeletonSized.tsx
+++ b/packages/design-system/src/components/Skeleton/variations/SkeletonSized.tsx
@@ -7,26 +7,24 @@ import SkeletonPrimitive, { SkeletonPrimitiveProps } from '../Primitive/Skeleton
 import style from './SkeletonSized.module.scss';
 
 export type SkeletonSizedProps = Omit<SkeletonPrimitiveProps, 'className'> & {
-	height?: number;
-	width?: number;
+	height?: string;
+	width?: string;
 	isCircle?: boolean;
 };
 
 const SkeletonSized = forwardRef(
 	(
-		{ height = 1.4, width = 2, isCircle, ...props }: SkeletonSizedProps,
+		{ height = '1.4rem', width = '2rem', isCircle, ...props }: SkeletonSizedProps,
 		ref: Ref<HTMLSpanElement>,
-	) => {
-		return (
-			<SkeletonPrimitive
-				// @ts-expect-error style is valid
-				style={{ height: `${height}rem`, width: `${width}rem` }}
-				className={classNames({ [style['skeleton-sized-circle']]: isCircle })}
-				{...props}
-				ref={ref}
-			/>
-		);
-	},
+	) => (
+		<SkeletonPrimitive
+			// @ts-expect-error style is valid
+			style={{ height, width }}
+			className={classNames({ [style['skeleton-sized-circle']]: isCircle })}
+			{...props}
+			ref={ref}
+		/>
+	),
 );
 SkeletonSized.displayName = 'SkeletonSized';
 
diff --git a/packages/design-system/src/stories/feedback/Skeleton.stories.tsx b/packages/design-system/src/stories/feedback/Skeleton.stories.tsx
index 4ccf32dc4fc..8a3e05b272d 100644
--- a/packages/design-system/src/stories/feedback/Skeleton.stories.tsx
+++ b/packages/design-system/src/stories/feedback/Skeleton.stories.tsx
@@ -102,16 +102,8 @@ SkeletonParagraphStory.argTypes = {
 export const SkeletonSizedStory = SkeletonSizedTemplate.bind({});
 SkeletonSizedStory.args = {
 	isCircle: true,
-};
-SkeletonSizedStory.argTypes = {
-	height: {
-		control: { type: 'number' },
-		defaultValue: 10,
-	},
-	width: {
-		control: { type: 'number' },
-		defaultValue: 10,
-	},
+	height: '3rem',
+	width: '20%',
 };
 
 export const SkeletonInputStory = SkeletonInputTemplate.bind({});