diff --git a/change/@griffel-core-cfd5601f-e13b-4186-a276-5c42b533d71d.json b/change/@griffel-core-cfd5601f-e13b-4186-a276-5c42b533d71d.json
new file mode 100644
index 000000000..3eecd9070
--- /dev/null
+++ b/change/@griffel-core-cfd5601f-e13b-4186-a276-5c42b533d71d.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "chore: update csstype to 3.0.10",
+  "packageName": "@griffel/core",
+  "email": "rahulsunil2@gmail.com",
+  "dependentChangeType": "patch"
+}
diff --git a/package.json b/package.json
index 63be2409a..9d22aa3c9 100644
--- a/package.json
+++ b/package.json
@@ -87,7 +87,7 @@
     "@linaria/babel-preset": "^3.0.0-beta.14",
     "@linaria/shaker": "^3.0.0-beta.14",
     "ajv": "^8.4.0",
-    "csstype": "^2.6.19",
+    "csstype": "^3.0.10",
     "enhanced-resolve": "^5.8.2",
     "loader-utils": "^2.0.0",
     "rtl-css-js": "^1.15.0",
diff --git a/packages/core/src/shorthands/border.ts b/packages/core/src/shorthands/border.ts
index cb3060c7f..3c0c455ba 100644
--- a/packages/core/src/shorthands/border.ts
+++ b/packages/core/src/shorthands/border.ts
@@ -1,4 +1,4 @@
-import type { BorderColorProperty, BorderStyleProperty, BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 import { borderWidth } from './borderWidth';
@@ -21,12 +21,15 @@ type BorderStyle = Pick<
   | 'borderLeftWidth'
 >;
 
-export function border(width: BorderWidthProperty<GriffelStylesCSSValue>): BorderStyle;
-export function border(width: BorderWidthProperty<GriffelStylesCSSValue>, style: BorderStyleProperty): BorderStyle;
+export function border(width: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderStyle;
 export function border(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
-  color: BorderColorProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+): BorderStyle;
+export function border(
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+  color: CSS.Property.BorderColor,
 ): BorderStyle;
 
 /**
@@ -40,7 +43,7 @@ export function border(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border
  */
 export function border(
-  ...values: [BorderWidthProperty<GriffelStylesCSSValue>, BorderStyleProperty?, BorderColorProperty?]
+  ...values: [CSS.Property.BorderWidth<GriffelStylesCSSValue>, CSS.Property.BorderStyle?, CSS.Property.BorderColor?]
 ): BorderStyle {
   return {
     ...borderWidth(values[0]),
diff --git a/packages/core/src/shorthands/borderBottom.ts b/packages/core/src/shorthands/borderBottom.ts
index ae2f4ff72..bb2be52bf 100644
--- a/packages/core/src/shorthands/borderBottom.ts
+++ b/packages/core/src/shorthands/borderBottom.ts
@@ -1,4 +1,4 @@
-import type { BorderColorProperty, BorderStyleProperty, BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 
 type BorderBottomStyle = Pick<
@@ -6,15 +6,15 @@ type BorderBottomStyle = Pick<
   'borderBottomWidth' | 'borderBottomStyle' | 'borderBottomColor'
 >;
 
-export function borderBottom(width: BorderWidthProperty<GriffelStylesCSSValue>): BorderBottomStyle;
+export function borderBottom(width: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderBottomStyle;
 export function borderBottom(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
 ): BorderBottomStyle;
 export function borderBottom(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
-  color: BorderColorProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+  color: CSS.Property.BorderColor,
 ): BorderBottomStyle;
 
 /**
@@ -28,7 +28,7 @@ export function borderBottom(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom
  */
 export function borderBottom(
-  ...values: [BorderWidthProperty<GriffelStylesCSSValue>, BorderStyleProperty?, BorderColorProperty?]
+  ...values: [CSS.Property.BorderWidth<GriffelStylesCSSValue>, CSS.Property.BorderStyle?, CSS.Property.BorderColor?]
 ): BorderBottomStyle {
   return {
     borderBottomWidth: values[0],
diff --git a/packages/core/src/shorthands/borderColor.ts b/packages/core/src/shorthands/borderColor.ts
index a70e46c36..aef33619a 100644
--- a/packages/core/src/shorthands/borderColor.ts
+++ b/packages/core/src/shorthands/borderColor.ts
@@ -1,4 +1,4 @@
-import type { BorderColorProperty } from 'csstype';
+import * as CSS from 'csstype';
 
 import type { GriffelStylesStrictCSSObject } from '../types';
 import { generateStyles } from './generateStyles';
@@ -8,18 +8,18 @@ type BorderColorStyle = Pick<
   'borderTopColor' | 'borderRightColor' | 'borderBottomColor' | 'borderLeftColor'
 >;
 
-export function borderColor(all: BorderColorProperty): BorderColorStyle;
-export function borderColor(vertical: BorderColorProperty, horizontal: BorderColorProperty): BorderColorStyle;
+export function borderColor(all: CSS.Property.BorderColor): BorderColorStyle;
+export function borderColor(vertical: CSS.Property.BorderColor, horizontal: CSS.Property.BorderColor): BorderColorStyle;
 export function borderColor(
-  top: BorderColorProperty,
-  horizontal: BorderColorProperty,
-  bottom: BorderColorProperty,
+  top: CSS.Property.BorderColor,
+  horizontal: CSS.Property.BorderColor,
+  bottom: CSS.Property.BorderColor,
 ): BorderColorStyle;
 export function borderColor(
-  top: BorderColorProperty,
-  right: BorderColorProperty,
-  bottom: BorderColorProperty,
-  left: BorderColorProperty,
+  top: CSS.Property.BorderColor,
+  right: CSS.Property.BorderColor,
+  bottom: CSS.Property.BorderColor,
+  left: CSS.Property.BorderColor,
 ): BorderColorStyle;
 
 /**
@@ -33,6 +33,6 @@ export function borderColor(
  *
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-color
  */
-export function borderColor(...values: BorderColorProperty[]): BorderColorStyle {
-  return generateStyles('border', 'Color', ...values);
+export function borderColor(...values: CSS.Property.BorderColor[]): BorderColorStyle {
+  return generateStyles<BorderColorStyle>('border', 'Color', ...values);
 }
diff --git a/packages/core/src/shorthands/borderLeft.ts b/packages/core/src/shorthands/borderLeft.ts
index e1f7faeb2..1dd25e8e3 100644
--- a/packages/core/src/shorthands/borderLeft.ts
+++ b/packages/core/src/shorthands/borderLeft.ts
@@ -1,17 +1,17 @@
-import type { BorderColorProperty, BorderStyleProperty, BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 
 type BorderLeftStyle = Pick<GriffelStylesStrictCSSObject, 'borderLeftColor' | 'borderLeftStyle' | 'borderLeftWidth'>;
 
-export function borderLeft(width: BorderWidthProperty<GriffelStylesCSSValue>): BorderLeftStyle;
+export function borderLeft(width: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderLeftStyle;
 export function borderLeft(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
 ): BorderLeftStyle;
 export function borderLeft(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
-  color: BorderColorProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+  color: CSS.Property.BorderColor,
 ): BorderLeftStyle;
 
 /**
@@ -25,7 +25,7 @@ export function borderLeft(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-left
  */
 export function borderLeft(
-  ...values: [BorderWidthProperty<GriffelStylesCSSValue>, BorderStyleProperty?, BorderColorProperty?]
+  ...values: [CSS.Property.BorderWidth<GriffelStylesCSSValue>, CSS.Property.BorderStyle?, CSS.Property.BorderColor?]
 ): BorderLeftStyle {
   return {
     borderLeftWidth: values[0],
diff --git a/packages/core/src/shorthands/borderRight.ts b/packages/core/src/shorthands/borderRight.ts
index 115028834..622a8bd29 100644
--- a/packages/core/src/shorthands/borderRight.ts
+++ b/packages/core/src/shorthands/borderRight.ts
@@ -1,4 +1,4 @@
-import type { BorderColorProperty, BorderStyleProperty, BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 
 type BorderRightStyle = Pick<
@@ -6,15 +6,15 @@ type BorderRightStyle = Pick<
   'borderRightWidth' | 'borderRightStyle' | 'borderRightColor'
 >;
 
-export function borderRight(width: BorderWidthProperty<GriffelStylesCSSValue>): BorderRightStyle;
+export function borderRight(width: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderRightStyle;
 export function borderRight(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
 ): BorderRightStyle;
 export function borderRight(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
-  color: BorderColorProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+  color: CSS.Property.BorderColor,
 ): BorderRightStyle;
 
 /**
@@ -28,7 +28,7 @@ export function borderRight(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-right
  */
 export function borderRight(
-  ...values: [BorderWidthProperty<GriffelStylesCSSValue>, BorderStyleProperty?, BorderColorProperty?]
+  ...values: [CSS.Property.BorderWidth<GriffelStylesCSSValue>, CSS.Property.BorderStyle?, CSS.Property.BorderColor?]
 ): BorderRightStyle {
   return {
     borderRightWidth: values[0],
diff --git a/packages/core/src/shorthands/borderStyle.ts b/packages/core/src/shorthands/borderStyle.ts
index eeaadde64..b330d0653 100644
--- a/packages/core/src/shorthands/borderStyle.ts
+++ b/packages/core/src/shorthands/borderStyle.ts
@@ -1,4 +1,4 @@
-import type { BorderStyleProperty } from 'csstype';
+import * as CSS from 'csstype';
 
 import type { GriffelStylesStrictCSSObject } from '../types';
 import { generateStyles } from './generateStyles';
@@ -8,18 +8,18 @@ type BorderStyleStyle = Pick<
   'borderTopStyle' | 'borderRightStyle' | 'borderBottomStyle' | 'borderLeftStyle'
 >;
 
-export function borderStyle(all: BorderStyleProperty): BorderStyleStyle;
-export function borderStyle(vertical: BorderStyleProperty, horizontal: BorderStyleProperty): BorderStyleStyle;
+export function borderStyle(all: CSS.Property.BorderStyle): BorderStyleStyle;
+export function borderStyle(vertical: CSS.Property.BorderStyle, horizontal: CSS.Property.BorderStyle): BorderStyleStyle;
 export function borderStyle(
-  top: BorderStyleProperty,
-  horizontal: BorderStyleProperty,
-  bottom: BorderStyleProperty,
+  top: CSS.Property.BorderStyle,
+  horizontal: CSS.Property.BorderStyle,
+  bottom: CSS.Property.BorderStyle,
 ): BorderStyleStyle;
 export function borderStyle(
-  top: BorderStyleProperty,
-  right: BorderStyleProperty,
-  bottom: BorderStyleProperty,
-  left: BorderStyleProperty,
+  top: CSS.Property.BorderStyle,
+  right: CSS.Property.BorderStyle,
+  bottom: CSS.Property.BorderStyle,
+  left: CSS.Property.BorderStyle,
 ): BorderStyleStyle;
 
 /**
@@ -33,6 +33,6 @@ export function borderStyle(
  *
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-style
  */
-export function borderStyle(...values: BorderStyleProperty[]): BorderStyleStyle {
-  return generateStyles('border', 'Style', ...values);
+export function borderStyle(...values: CSS.Property.BorderStyle[]): BorderStyleStyle {
+  return generateStyles<BorderStyleStyle>('border', 'Style', ...values);
 }
diff --git a/packages/core/src/shorthands/borderTop.ts b/packages/core/src/shorthands/borderTop.ts
index 07ae4f9c5..46e17f203 100644
--- a/packages/core/src/shorthands/borderTop.ts
+++ b/packages/core/src/shorthands/borderTop.ts
@@ -1,17 +1,17 @@
-import type { BorderColorProperty, BorderStyleProperty, BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 
 type BorderTopStyle = Pick<GriffelStylesStrictCSSObject, 'borderTopWidth' | 'borderTopStyle' | 'borderTopColor'>;
 
-export function borderTop(width: BorderWidthProperty<GriffelStylesCSSValue>): BorderTopStyle;
+export function borderTop(width: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderTopStyle;
 export function borderTop(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
 ): BorderTopStyle;
 export function borderTop(
-  width: BorderWidthProperty<GriffelStylesCSSValue>,
-  style: BorderStyleProperty,
-  color: BorderColorProperty,
+  width: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  style: CSS.Property.BorderStyle,
+  color: CSS.Property.BorderColor,
 ): BorderTopStyle;
 
 /**
@@ -25,7 +25,7 @@ export function borderTop(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-top
  */
 export function borderTop(
-  ...values: [BorderWidthProperty<GriffelStylesCSSValue>, BorderStyleProperty?, BorderColorProperty?]
+  ...values: [CSS.Property.BorderWidth<GriffelStylesCSSValue>, CSS.Property.BorderStyle?, CSS.Property.BorderColor?]
 ): BorderTopStyle {
   return {
     borderTopWidth: values[0],
diff --git a/packages/core/src/shorthands/borderWidth.ts b/packages/core/src/shorthands/borderWidth.ts
index ef06fd52b..d22374287 100644
--- a/packages/core/src/shorthands/borderWidth.ts
+++ b/packages/core/src/shorthands/borderWidth.ts
@@ -1,4 +1,4 @@
-import type { BorderWidthProperty } from 'csstype';
+import * as CSS from 'csstype';
 
 import type { GriffelStylesStrictCSSObject, GriffelStylesCSSValue } from '../types';
 import { generateStyles } from './generateStyles';
@@ -8,21 +8,21 @@ type BorderWidthStyle = Pick<
   'borderTopStyle' | 'borderRightStyle' | 'borderBottomStyle' | 'borderLeftStyle'
 >;
 
-export function borderWidth(all: BorderWidthProperty<GriffelStylesCSSValue>): BorderWidthStyle;
+export function borderWidth(all: CSS.Property.BorderWidth<GriffelStylesCSSValue>): BorderWidthStyle;
 export function borderWidth(
-  vertical: BorderWidthProperty<GriffelStylesCSSValue>,
-  horizontal: BorderWidthProperty<GriffelStylesCSSValue>,
+  vertical: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  horizontal: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
 ): BorderWidthStyle;
 export function borderWidth(
-  top: BorderWidthProperty<GriffelStylesCSSValue>,
-  horizontal: BorderWidthProperty<GriffelStylesCSSValue>,
-  bottom: BorderWidthProperty<GriffelStylesCSSValue>,
+  top: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  horizontal: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  bottom: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
 ): BorderWidthStyle;
 export function borderWidth(
-  top: BorderWidthProperty<GriffelStylesCSSValue>,
-  right: BorderWidthProperty<GriffelStylesCSSValue>,
-  bottom: BorderWidthProperty<GriffelStylesCSSValue>,
-  left: BorderWidthProperty<GriffelStylesCSSValue>,
+  top: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  right: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  bottom: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
+  left: CSS.Property.BorderWidth<GriffelStylesCSSValue>,
 ): BorderWidthStyle;
 
 /**
@@ -36,6 +36,6 @@ export function borderWidth(
  *
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/border-width
  */
-export function borderWidth(...values: BorderWidthProperty<GriffelStylesCSSValue>[]): BorderWidthStyle {
-  return generateStyles('border', 'Width', ...values);
+export function borderWidth(...values: CSS.Property.BorderWidth<GriffelStylesCSSValue>[]): BorderWidthStyle {
+  return generateStyles<BorderWidthStyle>('border', 'Width', ...values);
 }
diff --git a/packages/core/src/shorthands/generateStyles.ts b/packages/core/src/shorthands/generateStyles.ts
index 4819c58df..53a9999bf 100644
--- a/packages/core/src/shorthands/generateStyles.ts
+++ b/packages/core/src/shorthands/generateStyles.ts
@@ -1,24 +1,24 @@
-import { GriffelStylesCSSValue, GriffelStylesStrictCSSObject } from '../types';
+import { GriffelStylesCSSValue } from '../types';
 
 type DirectionalProperties = 'border' | 'padding' | 'margin';
 
 const positionMap = ['Top', 'Right', 'Bottom', 'Left'];
 
-export function generateStyles(
+export function generateStyles<Styles extends Record<string, GriffelStylesCSSValue>>(
   property: DirectionalProperties,
   suffix: '' | 'Color' | 'Style' | 'Width',
   ...values: GriffelStylesCSSValue[]
-): GriffelStylesStrictCSSObject {
+): Styles {
   const [firstValue, secondValue = firstValue, thirdValue = firstValue, fourthValue = secondValue] = values;
   const valuesWithDefaults = [firstValue, secondValue, thirdValue, fourthValue];
 
-  const styles: GriffelStylesStrictCSSObject = {};
+  const styles: Styles = {} as Styles;
 
   for (let i = 0; i < valuesWithDefaults.length; i += 1) {
     if (valuesWithDefaults[i] || valuesWithDefaults[i] === 0) {
-      const newKey = (property + positionMap[i] + suffix) as keyof GriffelStylesStrictCSSObject;
+      const newKey = (property + positionMap[i] + suffix) as keyof Styles;
 
-      styles[newKey] = valuesWithDefaults[i] as unknown as undefined;
+      styles[newKey] = valuesWithDefaults[i] as Styles[keyof Styles];
     }
   }
 
diff --git a/packages/core/src/shorthands/margin.ts b/packages/core/src/shorthands/margin.ts
index 4fcd2b638..f33420697 100644
--- a/packages/core/src/shorthands/margin.ts
+++ b/packages/core/src/shorthands/margin.ts
@@ -29,5 +29,5 @@ export function margin(
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/margin
  */
 export function margin(...values: GriffelStylesCSSValue[]): MarginStyle {
-  return generateStyles('margin', '', ...values);
+  return generateStyles<MarginStyle>('margin', '', ...values);
 }
diff --git a/packages/core/src/shorthands/overflow.ts b/packages/core/src/shorthands/overflow.ts
index 69a8fc742..d40233d4d 100644
--- a/packages/core/src/shorthands/overflow.ts
+++ b/packages/core/src/shorthands/overflow.ts
@@ -1,4 +1,4 @@
-import type { OverflowProperty } from 'csstype';
+import * as CSS from 'csstype';
 import type { GriffelStylesStrictCSSObject } from '../types';
 
 type OverflowStyle = Pick<GriffelStylesStrictCSSObject, 'overflowX' | 'overflowY'>;
@@ -12,7 +12,10 @@ type OverflowStyle = Pick<GriffelStylesStrictCSSObject, 'overflowX' | 'overflowY
  *
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/overflow
  */
-export function overflow(overflowX: OverflowProperty, overflowY: OverflowProperty = overflowX): OverflowStyle {
+export function overflow(
+  overflowX: CSS.Property.Overflow,
+  overflowY: CSS.Property.Overflow = overflowX,
+): OverflowStyle {
   return {
     overflowX,
     overflowY,
diff --git a/packages/core/src/shorthands/padding.ts b/packages/core/src/shorthands/padding.ts
index 31ad11c28..0dcb79098 100644
--- a/packages/core/src/shorthands/padding.ts
+++ b/packages/core/src/shorthands/padding.ts
@@ -28,6 +28,6 @@ export function padding(
  *
  * See https://developer.mozilla.org/en-US/docs/Web/CSS/padding
  */
-export function padding(...values: GriffelStylesCSSValue[]): PaddingStyle {
-  return generateStyles('padding', '', ...values);
+export function padding(...values: GriffelStylesCSSValue[]) {
+  return generateStyles<PaddingStyle>('padding', '', ...values);
 }
diff --git a/packages/core/src/types.test.ts b/packages/core/src/types.test.ts
index 0096e3cc5..bbc601402 100644
--- a/packages/core/src/types.test.ts
+++ b/packages/core/src/types.test.ts
@@ -83,8 +83,8 @@ describe('types tests', () => {
     // Invalid values
     //
 
-    // @ts-expect-error "1" is invalid value for "flexShrink"
-    assertType({ flexShrink: '1' });
+    // @ts-expect-error "1" is invalid value for "overflow"
+    assertType({ overflow: '1' });
     // @ts-expect-error "paddingLeft" cannot be numeric value
     assertType({ paddingLeft: 5 });
     // @ts-expect-error "0" is invalid value for "color"
@@ -95,8 +95,8 @@ describe('types tests', () => {
 
     assertType({
       ':hover': {
-        // @ts-expect-error "1" is invalid value for "flexShrink"
-        flexShrink: '1',
+        // @ts-expect-error "1" is invalid value for "overflow"
+        overflow: '1',
         // @ts-expect-error "padding" is banned
         padding: 0,
         // @ts-expect-error "paddingLeft" cannot be numeric value
@@ -109,8 +109,8 @@ describe('types tests', () => {
 
     assertType({
       ':hover:focus': {
-        // @ts-expect-error "1" is invalid value for "flexShrink"
-        flexShrink: '1',
+        // @ts-expect-error "1" is invalid value for "overflow"
+        overflow: '1',
         // @ts-expect-error "padding" is banned
         padding: 0,
         // @ts-expect-error "paddingLeft" cannot be numeric value
@@ -124,8 +124,8 @@ describe('types tests', () => {
     assertType({
       '.foo': {
         '.baz': {
-          // @ts-expect-error "1" is invalid value for "flexShrink"
-          flexShrink: '1',
+          // @ts-expect-error "1" is invalid value for "overflow"
+          overflow: '1',
           // @ts-expect-error "padding" is banned
           padding: 0,
           // @ts-expect-error "paddingLeft" cannot be numeric value
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
index 8f6fed541..4ce0c3b0c 100644
--- a/packages/core/src/types.ts
+++ b/packages/core/src/types.ts
@@ -2,7 +2,7 @@ import * as CSS from 'csstype';
 
 export type GriffelStylesCSSValue = string | 0;
 
-type GriffeltylesUnsupportedCSSProperties = {
+type GriffelStylesUnsupportedCSSProperties = {
   // We don't support expansion of CSS shorthands
   animation?: never;
   background?: never;
@@ -52,11 +52,11 @@ type GriffelStylesCSSProperties = Omit<
   // We have custom definition for "animationName" and "fontWeight"
   'animationName' | 'fontWeight'
 > &
-  GriffeltylesUnsupportedCSSProperties;
+  GriffelStylesUnsupportedCSSProperties;
 
 export type GriffelStylesStrictCSSObject = GriffelStylesCSSProperties &
   GriffelStylesCSSPseudos & {
-    animationName?: GriffelAnimation | GriffelAnimation[] | CSS.AnimationProperty;
+    animationName?: GriffelAnimation | GriffelAnimation[] | CSS.Property.Animation;
     fontWeight?: CSS.Properties['fontWeight'] | string;
   };
 
diff --git a/yarn.lock b/yarn.lock
index 7e6853bbe..0b62896d3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10230,14 +10230,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"csstype@npm:^2.5.7, csstype@npm:^2.6.19":
+"csstype@npm:^2.5.7":
   version: 2.6.19
   resolution: "csstype@npm:2.6.19"
   checksum: 72b51ddd30ba308d08373cd890e79526efdc19a9762941845040055f75353992f2d8d4cf4db282a8e1d3d9d2a39c989c65fe32b7b2655f08d313660c4048d2d6
   languageName: node
   linkType: hard
 
-"csstype@npm:^3.0.2":
+"csstype@npm:^3.0.10, csstype@npm:^3.0.2":
   version: 3.0.10
   resolution: "csstype@npm:3.0.10"
   checksum: 20a8fa324f2b33ddf94aa7507d1b6ab3daa6f3cc308888dc50126585d7952f2471de69b2dbe0635d1fdc31223fef8e070842691877e725caf456e2378685a631
@@ -13089,7 +13089,7 @@ __metadata:
     babel-plugin-annotate-pure-calls: 0.4.0
     babel-plugin-tester: 10.0.0
     beachball: ^2.20.0
-    csstype: ^2.6.19
+    csstype: ^3.0.10
     enhanced-resolve: ^5.8.2
     eslint: 8.2.0
     eslint-config-prettier: 8.1.0