diff --git a/.gitignore b/.gitignore
index fd3dbb5..3f5808a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,6 +17,7 @@
 /build
 
 # misc
+.idea
 .DS_Store
 *.pem
 
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 876f282..f926f2d 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1436,6 +1436,28 @@ export default function AnimationsExample() {
 													</p>
 												</div>
 											</div>
+											<div className="space-y-4">
+												<div className="space-y-2">
+													<label className="text-sm font-medium flex items-center gap-2">
+														<span className="w-2 h-2 bg-slate-500 rounded-full"></span>
+														No Animation
+													</label>
+													<MultiSelect
+														options={projectTypesWithStyle.slice(0, 3)}
+														onValueChange={() => {}}
+														defaultValue={["web-app"]}
+														animationConfig={{
+                                                            badgeAnimation: "none",
+                                                            popoverAnimation: "none",
+                                                            optionHoverAnimation: "none",
+														}}
+														placeholder="Without animation effect"
+													/>
+													<p className="text-xs text-muted-foreground">
+														With animation effects disabled
+													</p>
+												</div>
+											</div>
 										</div>
 									</div>
 									<div
diff --git a/src/components/multi-select.tsx b/src/components/multi-select.tsx
index 0770a93..1eaf1c5 100644
--- a/src/components/multi-select.tsx
+++ b/src/components/multi-select.tsx
@@ -519,7 +519,7 @@ export const MultiSelect = React.forwardRef<MultiSelectRef, MultiSelectProps>(
 					case "flip":
 						return "animate-flipIn";
 					case "none":
-						return "";
+						return "!animate-none";
 					default:
 						return "";
 				}
@@ -858,7 +858,10 @@ export const MultiSelect = React.forwardRef<MultiSelectRef, MultiSelectProps>(
 														key={value}
 														className={cn(
 															getBadgeAnimationClass(),
-															multiSelectVariants({ variant }),
+															multiSelectVariants({
+																variant,
+																badgeAnimation: animationConfig?.badgeAnimation
+															}),
 															customStyle?.gradient &&
 																"text-white border-transparent",
 															responsiveSettings.compactMode &&
@@ -930,7 +933,10 @@ export const MultiSelect = React.forwardRef<MultiSelectRef, MultiSelectProps>(
 												className={cn(
 													"bg-transparent text-foreground border-foreground/1 hover:bg-transparent",
 													getBadgeAnimationClass(),
-													multiSelectVariants({ variant }),
+													multiSelectVariants({
+														variant,
+														badgeAnimation: animationConfig?.badgeAnimation
+													}),
 													responsiveSettings.compactMode &&
 														"text-xs px-1.5 py-0.5",
 													singleLine && "flex-shrink-0 whitespace-nowrap",