diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/buttons/IconButtonsExamples.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/buttons/IconButtonsExamples.kt
index 97f4c6c56..b4aab43a3 100644
--- a/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/buttons/IconButtonsExamples.kt
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/buttons/IconButtonsExamples.kt
@@ -24,9 +24,11 @@ package com.adevinta.spark.catalog.examples.samples.buttons
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.unit.dp
 import com.adevinta.spark.catalog.model.Example
@@ -36,9 +38,12 @@ import com.adevinta.spark.components.iconbuttons.IconButtonFilled
 import com.adevinta.spark.components.iconbuttons.IconButtonGhost
 import com.adevinta.spark.components.iconbuttons.IconButtonOutlined
 import com.adevinta.spark.components.iconbuttons.IconButtonTinted
-import com.adevinta.spark.icons.LikeFill
+import com.adevinta.spark.icons.BellShake
+import com.adevinta.spark.icons.SparkAnimatedIcons
 import com.adevinta.spark.icons.SparkIcon
-import com.adevinta.spark.icons.SparkIcons
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.launch
+import kotlin.time.Duration.Companion.seconds
 
 private const val IconButtonsExampleDescription = "Icon Button examples"
 private const val IconButtonsExampleSourceUrl = "$SampleSourceUrl/IconButtonSamples.kt"
@@ -56,6 +61,7 @@ public val IconButtonsExamples: List<Example> = listOf(
                     icon = icon,
                     contentDescription = contentDescription,
                     isLoading = isLoading,
+                    atEnd = false,
                 )
             },
         )
@@ -143,7 +149,7 @@ private fun IconButtonSample(
     Column(
         verticalArrangement = Arrangement.spacedBy(16.dp),
     ) {
-        val icon = SparkIcons.LikeFill
+        val icon = SparkAnimatedIcons.BellShake
         val contentDescription = "Localized Content Description"
         val isLoading by remember { mutableStateOf(false) }
         button(
diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/icons/IconsExamples.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/icons/IconsExamples.kt
new file mode 100644
index 000000000..a442c9b29
--- /dev/null
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/examples/samples/icons/IconsExamples.kt
@@ -0,0 +1,373 @@
+/*
+ * Copyright (c) 2023 Adevinta
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+package com.adevinta.spark.catalog.examples.samples.icons
+
+import androidx.compose.animation.animateColorAsState
+import androidx.compose.animation.core.tween
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.defaultMinSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.windowInsetsPadding
+import androidx.compose.foundation.selection.selectable
+import androidx.compose.foundation.selection.selectableGroup
+import androidx.compose.material.ripple.rememberRipple
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.LocalTextStyle
+import androidx.compose.material3.NavigationBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.Layout
+import androidx.compose.ui.layout.MeasureResult
+import androidx.compose.ui.layout.MeasureScope
+import androidx.compose.ui.layout.Placeable
+import androidx.compose.ui.layout.layoutId
+import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.semantics.clearAndSetSemantics
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.Constraints
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.util.fastFirst
+import com.adevinta.spark.SparkTheme
+import com.adevinta.spark.catalog.model.Example
+import com.adevinta.spark.catalog.util.SampleSourceUrl
+import com.adevinta.spark.components.icons.Icon
+import com.adevinta.spark.components.surface.Surface
+import com.adevinta.spark.components.text.Text
+import com.adevinta.spark.icons.AccountToFill
+import com.adevinta.spark.icons.AccountToFillAlt
+import com.adevinta.spark.icons.AddToFill
+import com.adevinta.spark.icons.LikeToFill
+import com.adevinta.spark.icons.MessageToOutline
+import com.adevinta.spark.icons.SearchToOutline
+import com.adevinta.spark.icons.SparkAnimatedIcons
+import com.adevinta.spark.tokens.disabled
+import com.adevinta.spark.tokens.highlight
+import kotlin.math.roundToInt
+
+private const val IconsExampleSourceUrl = "$SampleSourceUrl/IconsSamples.kt"
+
+public val IconsExamples: List<Example> = listOf(
+    Example(
+        name = "Animated Navigation bar",
+        description = "Show how a lbc animated nav bar could look like",
+        sourceUrl = IconsExampleSourceUrl,
+    ) {
+        var selected by remember { mutableStateOf(SparkAnimatedIcons.SearchToOutline.drawableId) }
+        var icons by remember {
+            mutableStateOf(
+                listOf(
+                    SparkAnimatedIcons.SearchToOutline,
+                    SparkAnimatedIcons.LikeToFill,
+                    SparkAnimatedIcons.AddToFill,
+                    SparkAnimatedIcons.MessageToOutline,
+                    SparkAnimatedIcons.AccountToFillAlt,
+                ),
+            )
+        }
+        Surface(
+            elevation = NavigationBarDefaults.Elevation,
+        ) {
+            Row(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(horizontal = 4.dp)
+                    .windowInsetsPadding(NavigationBarDefaults.windowInsets)
+                    .defaultMinSize(NavigationBarHeight)
+                    .selectableGroup(),
+            ) {
+                NavigationBarItem(
+                    selected = selected == SparkAnimatedIcons.SearchToOutline.drawableId,
+                    onClick = {
+                        selected = SparkAnimatedIcons.SearchToOutline.drawableId
+                    },
+                    icon = {
+                        Icon(
+                            modifier = Modifier.size(24.dp),
+                            sparkIcon = SparkAnimatedIcons.SearchToOutline,
+                            contentDescription = null,
+                            atEnd = selected != SparkAnimatedIcons.SearchToOutline.drawableId,
+                        )
+                    },
+                    label = {
+                        Text(
+                            text = "Rechercher",
+                            overflow = TextOverflow.Ellipsis,
+                            maxLines = 1,
+                        )
+                    },
+                )
+                NavigationBarItem(
+                    selected = selected == SparkAnimatedIcons.LikeToFill.drawableId,
+                    onClick = {
+                        selected = SparkAnimatedIcons.LikeToFill.drawableId
+                    },
+                    icon = {
+                        Icon(
+                            modifier = Modifier.size(24.dp),
+                            sparkIcon = SparkAnimatedIcons.LikeToFill,
+                            contentDescription = null,
+                            atEnd = selected == SparkAnimatedIcons.LikeToFill.drawableId,
+                        )
+                    },
+                    label = {
+                        Text(
+                            text = "Favoris",
+                            overflow = TextOverflow.Ellipsis,
+                            maxLines = 1,
+                        )
+                    },
+                )
+                NavigationBarItem(
+                    selected = selected == SparkAnimatedIcons.AddToFill.drawableId,
+                    onClick = {
+                        selected = SparkAnimatedIcons.AddToFill.drawableId
+                    },
+                    icon = {
+                        Icon(
+                            modifier = Modifier.size(24.dp),
+                            sparkIcon = SparkAnimatedIcons.AddToFill,
+                            contentDescription = null,
+                            atEnd = selected == SparkAnimatedIcons.AddToFill.drawableId,
+                        )
+                    },
+                    label = {
+                        Text(
+                            text = "Publier",
+                            overflow = TextOverflow.Ellipsis,
+                            maxLines = 1,
+                        )
+                    },
+                )
+                NavigationBarItem(
+                    selected = selected == SparkAnimatedIcons.MessageToOutline.drawableId,
+                    onClick = {
+                        selected = SparkAnimatedIcons.MessageToOutline.drawableId
+                    },
+                    icon = {
+                        Icon(
+                            modifier = Modifier.size(24.dp),
+                            sparkIcon = SparkAnimatedIcons.MessageToOutline,
+                            contentDescription = null,
+                            atEnd = selected != SparkAnimatedIcons.MessageToOutline.drawableId,
+                        )
+                    },
+                    label = {
+                        Text(
+                            text = "Messages",
+                            overflow = TextOverflow.Ellipsis,
+                            maxLines = 1,
+                        )
+                    },
+                )
+                NavigationBarItem(
+                    selected = selected == SparkAnimatedIcons.AccountToFill.drawableId,
+                    onClick = {
+                        selected = SparkAnimatedIcons.AccountToFill.drawableId
+                    },
+                    icon = {
+                        Icon(
+                            modifier = Modifier.size(24.dp),
+                            sparkIcon = SparkAnimatedIcons.AccountToFill,
+                            contentDescription = null,
+                            atEnd = selected == SparkAnimatedIcons.AccountToFill.drawableId,
+                        )
+                    },
+                    label = {
+                        Text(
+                            text = "Compte",
+                            overflow = TextOverflow.Ellipsis,
+                            maxLines = 1,
+                        )
+                    },
+                )
+            }
+        }
+    },
+)
+
+@Composable
+public fun RowScope.NavigationBarItem(
+    selected: Boolean,
+    onClick: () -> Unit,
+    icon: @Composable () -> Unit,
+    modifier: Modifier = Modifier,
+    enabled: Boolean = true,
+    label: @Composable (() -> Unit)? = null,
+    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+) {
+    val targetValue = when {
+        !enabled -> SparkTheme.colors.onSurface.disabled
+        else -> SparkTheme.colors.onSurface
+    }
+    val contentColor by animateColorAsState(
+        targetValue = targetValue,
+        animationSpec = tween(ItemAnimationDurationMillis),
+    )
+    val styledIcon = @Composable {
+
+        // If there's a label, don't have a11y services repeat the icon description.
+        val clearSemantics = label != null
+        Box(modifier = if (clearSemantics) Modifier.clearAndSetSemantics {} else Modifier) {
+            CompositionLocalProvider(LocalContentColor provides contentColor, content = icon)
+        }
+    }
+
+    val styledLabel: @Composable (() -> Unit)? = label?.let {
+        @Composable {
+            val style = SparkTheme.typography.caption.highlight
+            val mergedStyle = LocalTextStyle.current.merge(style)
+            CompositionLocalProvider(
+                LocalContentColor provides contentColor,
+                LocalTextStyle provides mergedStyle,
+                content = label,
+            )
+        }
+    }
+
+    // The color of the Ripple should always the selected color, as we want to show the color
+    // before the item is considered selected, and hence before the new contentColor is
+    // provided by BottomNavigationTransition.
+    val ripple = rememberRipple(bounded = false, color = SparkTheme.colors.neutral)
+
+    Box(
+        modifier
+            .selectable(
+                selected = selected,
+                onClick = onClick,
+                enabled = enabled,
+                role = Role.Tab,
+                interactionSource = interactionSource,
+                indication = ripple,
+            )
+            .defaultMinSize(NavigationBarHeight)
+            .weight(1f),
+        contentAlignment = Alignment.Center,
+        propagateMinConstraints = true,
+    ) {
+        NavigationBarItemLayout(
+            icon = styledIcon,
+            label = styledLabel,
+        )
+    }
+}
+
+/**
+ * Base layout for a [NavigationBarItem].
+ *
+ * @param icon icon for this item
+ * @param label text label for this item
+ */
+@Composable
+internal fun NavigationBarItemLayout(
+    icon: @Composable () -> Unit,
+    label: @Composable (() -> Unit)?,
+) {
+    Layout(
+        content = {
+            Box(Modifier.layoutId(IconLayoutIdTag)) { icon() }
+
+            if (label != null) {
+                Box(
+                    Modifier
+                        .layoutId(LabelLayoutIdTag)
+                        .padding(horizontal = NavigationBarItemHorizontalPadding / 2),
+                ) { label() }
+            }
+        },
+    ) { measurables, constraints ->
+        @Suppress("NAME_SHADOWING")
+        val looseConstraints = constraints.copy(minWidth = 0, minHeight = 0)
+        val iconPlaceable =
+            measurables.fastFirst { it.layoutId == IconLayoutIdTag }.measure(looseConstraints)
+
+        val labelPlaceable =
+            label?.let {
+                measurables
+                    .fastFirst { it.layoutId == LabelLayoutIdTag }
+                    .measure(looseConstraints)
+            }
+
+        placeLabelAndIcon(
+            labelPlaceable!!,
+            iconPlaceable,
+            constraints,
+        )
+    }
+}
+
+/**
+ * Places the provided [Placeable]s in the correct position.
+ *
+ * @param labelPlaceable text label placeable inside this item
+ * @param iconPlaceable icon placeable inside this item
+ * @param constraints constraints of the item
+ */
+private fun MeasureScope.placeLabelAndIcon(
+    labelPlaceable: Placeable,
+    iconPlaceable: Placeable,
+    constraints: Constraints,
+): MeasureResult {
+    val contentHeight =
+        iconPlaceable.height + IndicatorVerticalPadding.toPx() * 2 + labelPlaceable.height + 2.0.dp.toPx()
+
+    // Icon (when selected) should be `contentVerticalPadding` from top
+    val selectedIconY = IndicatorVerticalPadding.toPx()
+
+    // Label should be fixed padding below icon
+    val labelY = selectedIconY + iconPlaceable.height + 2.0.dp.toPx()
+
+    val containerWidth = constraints.maxWidth
+
+    val labelX = (containerWidth - labelPlaceable.width) / 2
+    val iconX = (containerWidth - iconPlaceable.width) / 2
+
+    return layout(containerWidth, contentHeight.roundToInt()) {
+        labelPlaceable.placeRelative(labelX, (labelY).roundToInt())
+        iconPlaceable.placeRelative(iconX, (selectedIconY).roundToInt())
+    }
+}
+
+private const val IconLayoutIdTag: String = "icon"
+
+private const val LabelLayoutIdTag: String = "label"
+
+internal val NavigationBarHeight: Dp = 58.dp
+
+internal const val ItemAnimationDurationMillis: Int = 100
+
+/*@VisibleForTesting*/
+private val NavigationBarItemHorizontalPadding: Dp = 4.dp
+
+/*@VisibleForTesting*/
+private val IndicatorVerticalPadding: Dp = 8.dp
diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconDemoScreen.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconDemoScreen.kt
index 97c0ba972..842f801ea 100644
--- a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconDemoScreen.kt
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconDemoScreen.kt
@@ -50,16 +50,24 @@ public fun IconDemoScreen(
                 )
             }
             composable(
-                route = "$IconDemoRoute/{$IconIdArgName}/{$IconNameArgName}",
+                route = "$IconDemoRoute/{$IconIdArgName}/{$IconNameArgName}/{$IconAnimatedArgName}",
                 arguments = listOf(
                     navArgument(IconIdArgName) { type = NavType.IntType },
                     navArgument(IconNameArgName) { type = NavType.StringType },
+                    navArgument(IconAnimatedArgName) { type = NavType.BoolType },
                 ),
             ) { navBackStackEntry ->
                 val arguments = requireNotNull(navBackStackEntry.arguments) { "No arguments" }
+                val isAnimated = arguments.getBoolean(IconAnimatedArgName)
+                val icon = if(isAnimated) {
+                    SparkIcon.AnimatedDrawableRes(arguments.getInt(IconIdArgName))
+                } else {
+                    SparkIcon.DrawableRes(arguments.getInt(IconIdArgName))
+                }
                 IconExampleScreen(
-                    icon = SparkIcon.DrawableRes(arguments.getInt(IconIdArgName)),
+                    icon = icon,
                     name = requireNotNull(arguments.getString(IconNameArgName)) { "No name provided for the Icon" },
+                    isAnimated = isAnimated,
                 )
             }
         },
@@ -70,3 +78,4 @@ internal const val IconsList = "icons"
 internal const val IconDemoRoute = "iconDemo"
 internal const val IconIdArgName = "iconId"
 internal const val IconNameArgName = "iconName"
+internal const val IconAnimatedArgName = "iconAnimated"
diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconExampleScreen.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconExampleScreen.kt
index 3cfb43e6a..c307f2510 100644
--- a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconExampleScreen.kt
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconExampleScreen.kt
@@ -25,11 +25,14 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableIntStateOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -47,9 +50,12 @@ import com.adevinta.spark.components.toggles.SwitchLabelled
 import com.adevinta.spark.icons.Close
 import com.adevinta.spark.icons.SparkIcon
 import com.adevinta.spark.icons.SparkIcons
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.launch
+import kotlin.time.Duration.Companion.seconds
 
 @Composable
-internal fun IconExampleScreen(icon: SparkIcon, name: String) {
+internal fun IconExampleScreen(icon: SparkIcon, name: String, isAnimated: Boolean) {
     Column(
         modifier = Modifier
             .fillMaxSize()
@@ -57,19 +63,51 @@ internal fun IconExampleScreen(icon: SparkIcon, name: String) {
         horizontalAlignment = Alignment.CenterHorizontally,
         verticalArrangement = Arrangement.spacedBy(24.dp, Alignment.CenterVertically),
     ) {
-        IconButtonFilled(icon = icon, contentDescription = name, onClick = {})
-        ButtonFilled(onClick = {}, text = name, icon = icon)
-        TagFilled(text = name, leadingIcon = icon)
-        ChipTinted {
+        var atEnd by remember { mutableStateOf(false) }
+        var isRunning by remember { mutableStateOf(false) }
+
+        // This is necessary just if you want to run the animation when the
+        // component is displayed. Otherwise, you can remove it.
+        LaunchedEffect(icon, isRunning) {
+            while (isRunning) {
+                delay(3.seconds) // set here your delay between animations
+                atEnd = !atEnd
+            }
+        }
+        if (isAnimated) {
+            SwitchLabelled(
+                checked = isRunning,
+                onCheckedChange = { isRunning = !isRunning },
+            ) {
+                Text(text = "Animate indefinitely")
+            }
+        }
+
+        Icon(
+            sparkIcon = icon,
+            contentDescription = name,
+            modifier = Modifier.size(128.dp),
+            atEnd = atEnd,
+        )
+        IconButtonFilled(
+            icon = icon,
+            contentDescription = name,
+            onClick = {
+                atEnd = !atEnd
+            },
+            atEnd = atEnd,
+        )
+        ButtonFilled(onClick = { atEnd = !atEnd }, text = name, icon = icon, atEnd = atEnd)
+        TagFilled(text = name, leadingIcon = icon, atEnd = atEnd)
+        ChipTinted(
+            onClick = { atEnd = !atEnd }
+        ) {
             Text(text = name)
             Icon(sparkIcon = icon, contentDescription = name)
         }
-        var checked by remember {
-            mutableStateOf(true)
-        }
         SwitchLabelled(
-            checked = checked,
-            onCheckedChange = { checked = it },
+            checked = atEnd,
+            onCheckedChange = { atEnd = !atEnd },
             icons = SwitchIcons(checked = icon, unchecked = SparkIcons.Close),
         ) {
             Text(text = name)
diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconsScreen.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconsScreen.kt
index d4cb92233..471a176af 100644
--- a/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconsScreen.kt
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/icons/IconsScreen.kt
@@ -28,10 +28,12 @@ import androidx.annotation.DrawableRes
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.combinedClickable
+import androidx.compose.foundation.horizontalScroll
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ExperimentalLayoutApi
+import androidx.compose.foundation.layout.FlowRow
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.consumeWindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
@@ -39,8 +41,11 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.foundation.rememberScrollState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.Stable
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -60,11 +65,13 @@ import androidx.navigation.NavController
 import com.adevinta.spark.SparkTheme
 import com.adevinta.spark.catalog.R
 import com.adevinta.spark.catalog.util.splitCamelWithSpaces
+import com.adevinta.spark.components.chips.ChipSelectable
+import com.adevinta.spark.components.chips.ChipStyles
 import com.adevinta.spark.components.icons.Icon
 import com.adevinta.spark.components.icons.IconSize
-import com.adevinta.spark.components.spacer.VerticalSpacer
 import com.adevinta.spark.components.text.Text
 import com.adevinta.spark.components.textfields.TextField
+import com.adevinta.spark.icons.Check
 import com.adevinta.spark.icons.DeleteFill
 import com.adevinta.spark.icons.Search
 import com.adevinta.spark.icons.SparkIcon
@@ -83,27 +90,40 @@ public fun IconsScreen(
 ) {
     val context = LocalContext.current
     val focusManager = LocalFocusManager.current
-    var icons: List<NamedIcon> by remember {
+    var icons: List<NamedAsset> by remember {
         mutableStateOf(emptyList())
     }
     LaunchedEffect(Unit) {
         icons = getAllIconsRes(context)
     }
     var query: String by rememberSaveable { mutableStateOf("") }
-    val filteredIcons by remember {
+    var showIcons by rememberSaveable { mutableStateOf(true) }
+    var showAnimatedIcons by rememberSaveable { mutableStateOf(true) }
+
+    val filteredIcons by remember(query, showIcons, showAnimatedIcons) {
         derivedStateOf {
-            if (query.isEmpty()) icons else icons.filter { it.name.contains(query, ignoreCase = true) }
+            if (query.isEmpty()) {
+                icons
+            } else {
+                icons.filter { it.name.contains(query, ignoreCase = true) }
+            }.filterNot {
+                !showIcons && it is NamedAsset.Icon
+            }.filterNot {
+                !showAnimatedIcons && it is NamedAsset.AnimatedIcon
+            }
         }
     }
     Column(
-        modifier = modifier
-            .fillMaxSize()
-            .padding(16.dp),
+        modifier = modifier.fillMaxSize(),
+        verticalArrangement = Arrangement.spacedBy(8.dp),
     ) {
         TextField(
             value = query,
             onValueChange = { query = it },
-            modifier = Modifier.fillMaxWidth(),
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 16.dp)
+                .padding(top = 16.dp),
             placeholder = stringResource(id = R.string.icons_screen_search_helper),
             leadingContent = {
                 Icon(sparkIcon = SparkIcons.Search, contentDescription = null)
@@ -116,7 +136,29 @@ public fun IconsScreen(
                 )
             },
         )
-        VerticalSpacer(space = 16.dp)
+        FlowRow(
+            modifier = Modifier
+                .fillMaxWidth()
+                .horizontalScroll(rememberScrollState())
+                .padding(horizontal = 16.dp),
+            horizontalArrangement = Arrangement.spacedBy(8.dp),
+        ) {
+            ChipSelectable(
+                selected = showIcons,
+                text = "Icon",
+                onClick = { showIcons = !showIcons },
+                style = ChipStyles.Tinted,
+                leadingIcon = if (showIcons) SparkIcons.Check else null
+            )
+            ChipSelectable(
+                selected = showAnimatedIcons,
+                text = "Animated Icon",
+                onClick = { showAnimatedIcons = !showAnimatedIcons },
+                style = ChipStyles.Tinted,
+                leadingIcon = if (showAnimatedIcons) SparkIcons.Check else null
+            )
+
+        }
         LazyVerticalGrid(
             modifier = modifier
                 .consumeWindowInsets(contentPadding)
@@ -128,14 +170,19 @@ public fun IconsScreen(
                 ) {
                     focusManager.clearFocus()
                 },
-
             contentPadding = contentPadding,
             columns = GridCells.Adaptive(minSize = 60.dp),
             verticalArrangement = Arrangement.spacedBy(16.dp),
             horizontalArrangement = Arrangement.spacedBy(16.dp),
         ) {
-            items(filteredIcons.size) { index ->
-                val (drawableRes, iconName) = filteredIcons[index]
+            items(
+                items = filteredIcons,
+                key = { it.name },
+                contentType = { it is NamedAsset.Icon },
+            ) { asset ->
+                val drawableRes = asset.drawableRes
+                val iconName = asset.name
+                val isAnimated = asset is NamedAsset.AnimatedIcon
                 Column(
                     modifier = Modifier
                         .clip(SparkTheme.shapes.small)
@@ -143,11 +190,12 @@ public fun IconsScreen(
                             onLongClick = { copyToClipboard(context, iconName) },
                             onClick = {
                                 navController.navigate(
-                                    route = "$IconDemoRoute/$drawableRes/$iconName",
+                                    route = "$IconDemoRoute/$drawableRes/$iconName/$isAnimated",
                                 )
                             },
                         )
-                        .padding(8.dp),
+                        .padding(8.dp)
+                        .animateItemPlacement(),
                     horizontalAlignment = Alignment.CenterHorizontally,
                     verticalArrangement = Arrangement.spacedBy(4.dp),
                 ) {
@@ -167,10 +215,14 @@ public fun IconsScreen(
     }
 }
 
-private data class NamedIcon(
-    @DrawableRes val drawableRes: Int,
-    val name: String,
-)
+@Stable
+private sealed class NamedAsset(open val name: String, @DrawableRes open val drawableRes: Int) {
+    data class Icon(override val name: String, @DrawableRes override val drawableRes: Int) :
+        NamedAsset(name, drawableRes)
+
+    data class AnimatedIcon(override val name: String, @DrawableRes override val drawableRes: Int) :
+        NamedAsset(name, drawableRes)
+}
 
 private suspend fun getAllIconsRes(context: Context) = withContext(Default) {
     IconR.drawable::class.java.declaredFields.mapNotNull { field ->
@@ -178,10 +230,14 @@ private suspend fun getAllIconsRes(context: Context) = withContext(Default) {
         val icon = field.getInt(null)
         val name = context.resources.getResourceEntryName(icon)
         if (!name.startsWith(prefix)) return@mapNotNull null
-        NamedIcon(
-            drawableRes = icon,
-            name = name.removePrefix(prefix).toPascalCase(),
-        )
+        when {
+            name.contains("animated") -> {
+                val animatedName = name.removePrefix(prefix).removeSuffix("_animated").toPascalCase()
+                NamedAsset.AnimatedIcon(animatedName, icon)
+            }
+
+            else -> NamedAsset.Icon(name.removePrefix(prefix).toPascalCase(), icon)
+        }
     }
 }
 
diff --git a/catalog/src/main/kotlin/com/adevinta/spark/catalog/model/Components.kt b/catalog/src/main/kotlin/com/adevinta/spark/catalog/model/Components.kt
index 76c5984cb..c646cfbe7 100644
--- a/catalog/src/main/kotlin/com/adevinta/spark/catalog/model/Components.kt
+++ b/catalog/src/main/kotlin/com/adevinta/spark/catalog/model/Components.kt
@@ -50,6 +50,7 @@ import com.adevinta.spark.catalog.examples.samples.buttons.ButtonsExamples
 import com.adevinta.spark.catalog.examples.samples.buttons.IconButtonsExamples
 import com.adevinta.spark.catalog.examples.samples.chips.ChipsExamples
 import com.adevinta.spark.catalog.examples.samples.dialog.DialogsExamples
+import com.adevinta.spark.catalog.examples.samples.icons.IconsExamples
 import com.adevinta.spark.catalog.examples.samples.popover.PopoverExamples
 import com.adevinta.spark.catalog.examples.samples.progressbar.ProgressbarExamples
 import com.adevinta.spark.catalog.examples.samples.progresstracker.ProgressTrackerExamples
@@ -145,6 +146,19 @@ private val Dropdowns = Component(
     configurator = DropdownsConfigurator,
 )
 
+private val Icons = Component(
+    id = nextId(),
+    name = "Icons",
+    illustration = R.drawable.illu_component_iconbutton,
+    tintIcon = false,
+    description = R.string.component_iconbutton_description,
+    guidelinesUrl = "$ComponentGuidelinesUrl/p/2352e9-icon-button/b/32e1a2",
+    docsUrl = "$PackageSummaryUrl/com.adevinta.spark.components.iconbuttons/index.html",
+    sourceUrl = "$SparkSourceUrl/kotlin/com/adevinta/components/iconbuttons/IconButton.kt",
+    examples = IconsExamples,
+    configurator = null,
+)
+
 private val IconButtons = Component(
     id = nextId(),
     name = "IconButtons",
@@ -372,6 +386,7 @@ public val Components: List<Component> = listOf(
     Dialogs,
     Dividers,
     Dropdowns,
+    Icons,
     IconButtons,
     IconToggleButtons,
     Popovers,
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
index e63132daf..229b21e7c 100644
--- a/gradle/libs.versions.toml
+++ b/gradle/libs.versions.toml
@@ -50,6 +50,7 @@ androidx-activity-compose = { module = "androidx.activity:activity-compose", ver
 androidx-appCompat = { module = "androidx.appcompat:appcompat", version.ref = "androidx-appCompat" }
 androidx-appCompat-resources = { module = "androidx.appcompat:appcompat-resources", version.ref = "androidx-appCompat" }
 androidx-compose-bom = { module = "androidx.compose:compose-bom", version.ref = "androidx-compose-bom" }
+androidx-compose-animation-graphics = { module = "androidx.compose.animation:animation-graphics" }
 androidx-compose-foundation = { module = "androidx.compose.foundation:foundation" }
 androidx-compose-foundation-layout = { module = "androidx.compose.foundation:foundation-layout" }
 androidx-compose-material-iconsExtended = { module = "androidx.compose.material:material-icons-extended" }
diff --git a/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkAnimatedIcons.kt b/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkAnimatedIcons.kt
new file mode 100644
index 000000000..3fc0598c2
--- /dev/null
+++ b/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkAnimatedIcons.kt
@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) 2024 Adevinta
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+package com.adevinta.spark.icons
+
+import com.adevinta.spark.icons.SparkIcon.AnimatedDrawableRes
+
+public object SparkAnimatedIcons
+
+public val SparkAnimatedIcons.BellShake: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_bell_shake)
+
+public val SparkAnimatedIcons.SearchToOutline: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_search)
+
+public val SparkAnimatedIcons.LikeToFill: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_like)
+
+public val SparkAnimatedIcons.AddToFill: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_add)
+
+public val SparkAnimatedIcons.MessageToOutline: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_message)
+
+public val SparkAnimatedIcons.AccountToFill: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_account)
+
+public val SparkAnimatedIcons.AccountToFillAlt: AnimatedDrawableRes
+    get() = AnimatedDrawableRes(R.drawable.spark_icons_animated_account_alt)
diff --git a/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkIcon.kt b/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkIcon.kt
index b28fc53a0..055942efb 100644
--- a/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkIcon.kt
+++ b/spark-icons/src/main/kotlin/com/adevinta/spark/icons/SparkIcon.kt
@@ -27,5 +27,6 @@ import androidx.compose.ui.graphics.vector.ImageVector
 @Stable
 public sealed class SparkIcon {
     public data class DrawableRes(@androidx.annotation.DrawableRes val drawableId: Int) : SparkIcon()
+    public data class AnimatedDrawableRes(@androidx.annotation.DrawableRes val drawableId: Int) : SparkIcon()
     public data class Vector(val imageVector: ImageVector) : SparkIcon()
 }
diff --git a/spark-icons/src/main/res/drawable/spark_icons_account_outline.xml b/spark-icons/src/main/res/drawable/spark_icons_account_outline.xml
index 5a11129b6..b1d35ccb4 100644
--- a/spark-icons/src/main/res/drawable/spark_icons_account_outline.xml
+++ b/spark-icons/src/main/res/drawable/spark_icons_account_outline.xml
@@ -26,6 +26,11 @@
     android:viewportHeight="24">
   <path
       android:fillColor="#FF000000"
-      android:pathData="M12,4.19c-1.6,0 -2.93,1.26 -2.93,2.84S10.4,9.87 12,9.87s2.93,-1.26 2.93,-2.84S13.6,4.19 12,4.19M6.77,7.03C6.77,4.26 9.09,2 12,2s5.23,2.27 5.23,5.03 -2.32,5.03 -5.23,5.03 -5.23,-2.27 -5.23,-5.03M12,15.57c-1.85,0 -3.63,0.71 -4.95,1.98a6.69,6.69 0,0 0,-1.94 3.55c-0.12,0.6 -0.72,0.99 -1.34,0.88a1.1,1.1 0,0 1,-0.92 -1.28,8.9 8.9,0 0,1 2.56,-4.69c1.74,-1.68 4.11,-2.63 6.59,-2.63s4.84,0.95 6.59,2.63a8.83,8.83 0,0 1,2.56 4.69c0.12,0.6 -0.3,1.17 -0.92,1.28a1.14,1.14 0,0 1,-1.34 -0.88,6.69 6.69,0 0,0 -1.94,-3.55A7.1,7.1 0,0 0,12 15.57"
+      android:pathData="M12,15.57c-1.85,0 -3.63,0.71 -4.95,1.98a6.69,6.69 0,0 0,-1.94 3.55c-0.12,0.6 -0.72,0.99 -1.34,0.88a1.1,1.1 0,0 1,-0.92 -1.28,8.9 8.9,0 0,1 2.56,-4.69c1.74,-1.68 4.11,-2.63 6.59,-2.63s4.84,0.95 6.59,2.63a8.83,8.83 0,0 1,2.56 4.69c0.12,0.6 -0.3,1.17 -0.92,1.28a1.14,1.14 0,0 1,-1.34 -0.88,6.69 6.69,0 0,0 -1.94,-3.55A7.1,7.1 0,0 0,12 15.57"
       android:fillType="evenOdd"/>
+
+  <path
+      android:fillColor="#FF000000"
+      android:pathData="M6.77,7.03C6.77,4.26 9.09,2 12,2s5.23,2.27 5.23,5.03 -2.32,5.03 -5.23,5.03 -5.23,-2.27 -5.23,-5.03M12,4.19c-1.6,0 -2.93,1.26 -2.93,2.84S10.4,9.87 12,9.87s2.93,-1.26 2.93,-2.84S13.6,4.19 12,4.19"
+      android:fillType="nonZero"/>
 </vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_account.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_account.xml
new file mode 100644
index 000000000..8edd369b3
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_account.xml
@@ -0,0 +1,49 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path"
+                android:pathData="M 12 15.57 C 10.15 15.57 8.37 16.28 7.05 17.55 C 6.053 18.505 5.375 19.745 5.11 21.1 C 4.99 21.7 4.39 22.09 3.77 21.98 C 3.576 21.951 3.393 21.87 3.24 21.747 C 3.088 21.623 2.971 21.461 2.902 21.277 C 2.834 21.092 2.816 20.893 2.85 20.7 C 3.203 18.912 4.097 17.274 5.41 16.01 C 7.15 14.33 9.52 13.38 12 13.38 C 14.48 13.38 16.84 14.33 18.59 16.01 C 19.907 17.271 20.802 18.91 21.15 20.7 C 21.27 21.3 20.85 21.87 20.23 21.98 C 19.936 22.039 19.63 21.98 19.379 21.815 C 19.128 21.651 18.953 21.393 18.89 21.1 C 18.625 19.745 17.947 18.505 16.95 17.55 C 15.62 16.273 13.844 15.562 12 15.57"
+                android:fillColor="#FF000000"
+                android:fillType="evenOdd"/>
+            <group
+                android:name="group"
+                android:pivotX="12"
+                android:pivotY="17">
+                <path
+                    android:name="path_1"
+                    android:pathData="M 6.77 7.03 C 6.77 4.26 9.09 2 12 2 C 14.91 2 17.23 4.27 17.23 7.03 C 17.23 9.79 14.91 12.06 12 12.06 C 9.09 12.06 6.77 9.79 6.77 7.03 M 12 4.19 C 10.4 4.19 9.07 5.45 9.07 7.03 C 9.07 8.61 10.4 9.87 12 9.87 C 13.6 9.87 14.93 8.61 14.93 7.03 C 14.93 5.45 13.6 4.19 12 4.19"
+                    android:fillColor="#FF000000"/>
+            </group>
+        </vector>
+    </aapt:attr>
+    <target android:name="path_1">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="300"
+                android:valueFrom="M 6.77 7.03 C 6.77 4.26 9.09 2 12 2 C 14.91 2 17.23 4.27 17.23 7.03 C 17.23 9.79 14.91 12.06 12 12.06 C 9.09 12.06 6.77 9.79 6.77 7.03 M 12 4.19 C 10.4 4.19 9.07 5.45 9.07 7.03 C 9.07 8.61 10.4 9.87 12 9.87 C 13.6 9.87 14.93 8.61 14.93 7.03 C 14.93 5.45 13.6 4.19 12 4.19"
+                android:valueTo="M 6.91 7 C 6.91 4.24 9.19 2 12 2 C 14.81 2 17.09 4.24 17.09 7 C 17.09 9.76 14.81 12 12 12 C 9.19 12 6.91 9.76 6.91 7 M 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="300"
+                android:valueFrom="M 18.59 16.01 C 19.28 16.671 19.855 17.436 20.295 18.272 C 20.695 19.031 20.984 19.848 21.15 20.7 C 21.27 21.3 20.85 21.87 20.23 21.98 C 19.936 22.039 19.63 21.98 19.379 21.815 C 19.128 21.651 18.953 21.393 18.89 21.1 C 18.625 19.745 17.947 18.505 16.95 17.55 C 15.62 16.273 13.844 15.562 12 15.57 C 10.15 15.57 8.37 16.28 7.05 17.55 C 6.053 18.505 5.375 19.745 5.11 21.1 C 4.99 21.7 4.39 22.09 3.77 21.98 C 3.576 21.951 3.393 21.87 3.24 21.747 C 3.088 21.623 2.971 21.461 2.902 21.277 C 2.834 21.092 2.816 20.893 2.85 20.7 C 3.203 18.912 4.097 17.274 5.41 16.01 C 7.069 14.408 9.301 13.47 11.655 13.386 C 11.77 13.382 11.885 13.38 12 13.38 C 14.327 13.38 16.549 14.217 18.26 15.708 C 18.372 15.806 18.482 15.906 18.59 16.01"
+                android:valueTo="M 18.23 14.89 C 19.17 15.602 19.927 16.527 20.439 17.59 C 20.95 18.652 21.201 19.821 21.17 21 C 21.17 21.55 20.71 22 20.15 22 C 19.983 22 19.815 22 19.648 22 C 19.254 22 18.859 22 18.465 22 C 17.803 22 17.141 22 16.479 22 C 15.169 22 13.859 22 12.549 22 C 11.202 22 9.855 22 8.507 22 C 7.249 22 5.991 22 4.732 22 C 4.438 22 4.144 22 3.85 22 C 3.551 22 3.28 21.872 3.093 21.668 C 2.93 21.491 2.83 21.256 2.83 21 C 2.811 19.836 3.068 18.684 3.579 17.638 C 4.09 16.592 4.84 15.681 5.77 14.98 C 7.5 13.64 9.77 12.99 11.99 12.97 C 11.99 12.97 11.99 12.97 11.99 12.97 C 14.21 12.95 16.48 13.57 18.23 14.9 C 18.23 14.897 18.23 14.893 18.23 14.89"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_account_alt.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_account_alt.xml
new file mode 100644
index 000000000..0dadd5261
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_account_alt.xml
@@ -0,0 +1,117 @@
+
+<!--
+  Copyright (c) 2024 Adevinta
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  SOFTWARE.
+  -->
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path"
+                android:pathData="M 12 15.57 C 10.15 15.57 8.37 16.28 7.05 17.55 C 6.053 18.505 5.375 19.745 5.11 21.1 C 4.99 21.7 4.39 22.09 3.77 21.98 C 3.576 21.951 3.393 21.87 3.24 21.747 C 3.088 21.623 2.971 21.461 2.902 21.277 C 2.834 21.092 2.816 20.893 2.85 20.7 C 3.203 18.912 4.097 17.274 5.41 16.01 C 7.15 14.33 9.52 13.38 12 13.38 C 14.48 13.38 16.84 14.33 18.59 16.01 C 19.907 17.271 20.802 18.91 21.15 20.7 C 21.27 21.3 20.85 21.87 20.23 21.98 C 19.936 22.039 19.63 21.98 19.379 21.815 C 19.128 21.651 18.953 21.393 18.89 21.1 C 18.625 19.745 17.947 18.505 16.95 17.55 C 15.62 16.273 13.844 15.562 12 15.57"
+                android:fillColor="#FF000000"
+                android:fillType="evenOdd"/>
+            <group
+                android:name="group"
+                android:pivotX="12"
+                android:pivotY="20">
+                <path
+                    android:name="path_1"
+                    android:pathData="M 6.77 7.03 C 6.77 4.26 9.09 2 12 2 C 14.91 2 17.23 4.27 17.23 7.03 C 17.23 9.79 14.91 12.06 12 12.06 C 9.09 12.06 6.77 9.79 6.77 7.03 M 12 4.19 C 10.4 4.19 9.07 5.45 9.07 7.03 C 9.07 8.61 10.4 9.87 12 9.87 C 13.6 9.87 14.93 8.61 14.93 7.03 C 14.93 5.45 13.6 4.19 12 4.19"
+                    android:fillColor="#FF000000"/>
+            </group>
+        </vector>
+    </aapt:attr>
+    <target android:name="path_1">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:startOffset="600"
+                android:duration="400"
+                android:valueFrom="M 6.77 7.03 C 6.77 4.26 9.09 2 12 2 C 14.91 2 17.23 4.27 17.23 7.03 C 17.23 9.79 14.91 12.06 12 12.06 C 9.09 12.06 6.77 9.79 6.77 7.03 M 12 4.19 C 10.4 4.19 9.07 5.45 9.07 7.03 C 9.07 8.61 10.4 9.87 12 9.87 C 13.6 9.87 14.93 8.61 14.93 7.03 C 14.93 5.45 13.6 4.19 12 4.19"
+                android:valueTo="M 6.91 7 C 6.91 4.24 9.19 2 12 2 C 14.81 2 17.09 4.24 17.09 7 C 17.09 9.76 14.81 12 12 12 C 9.19 12 6.91 9.76 6.91 7 M 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03 C 12 7.03 12 7.03 12 7.03"
+                android:valueType="pathType"
+                android:interpolator="@android:anim/anticipate_overshoot_interpolator"/>
+        </aapt:attr>
+    </target>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:startOffset="600"
+                android:duration="400"
+                android:valueFrom="M 18.59 16.01 C 19.28 16.671 19.855 17.436 20.295 18.272 C 20.695 19.031 20.984 19.848 21.15 20.7 C 21.27 21.3 20.85 21.87 20.23 21.98 C 19.936 22.039 19.63 21.98 19.379 21.815 C 19.128 21.651 18.953 21.393 18.89 21.1 C 18.625 19.745 17.947 18.505 16.95 17.55 C 15.62 16.273 13.844 15.562 12 15.57 C 10.15 15.57 8.37 16.28 7.05 17.55 C 6.053 18.505 5.375 19.745 5.11 21.1 C 4.99 21.7 4.39 22.09 3.77 21.98 C 3.576 21.951 3.393 21.87 3.24 21.747 C 3.088 21.623 2.971 21.461 2.902 21.277 C 2.834 21.092 2.816 20.893 2.85 20.7 C 3.203 18.912 4.097 17.274 5.41 16.01 C 7.069 14.408 9.301 13.47 11.655 13.386 C 11.77 13.382 11.885 13.38 12 13.38 C 14.327 13.38 16.549 14.217 18.26 15.708 C 18.372 15.806 18.482 15.906 18.59 16.01"
+                android:valueTo="M 18.23 14.89 C 19.17 15.602 19.927 16.527 20.439 17.59 C 20.95 18.652 21.201 19.821 21.17 21 C 21.17 21.55 20.71 22 20.15 22 C 19.983 22 19.815 22 19.648 22 C 19.254 22 18.859 22 18.465 22 C 17.803 22 17.141 22 16.479 22 C 15.169 22 13.859 22 12.549 22 C 11.202 22 9.855 22 8.507 22 C 7.249 22 5.991 22 4.732 22 C 4.438 22 4.144 22 3.85 22 C 3.551 22 3.28 21.872 3.093 21.668 C 2.93 21.491 2.83 21.256 2.83 21 C 2.811 19.836 3.068 18.684 3.579 17.638 C 4.09 16.592 4.84 15.681 5.77 14.98 C 7.5 13.64 9.77 12.99 11.99 12.97 C 11.99 12.97 11.99 12.97 11.99 12.97 C 14.21 12.95 16.48 13.57 18.23 14.9 C 18.23 14.897 18.23 14.893 18.23 14.89"
+                android:valueType="pathType"
+                android:interpolator="@android:anim/bounce_interpolator"/>
+        </aapt:attr>
+    </target>
+    <target android:name="group">
+        <aapt:attr name="android:animation">
+            <set>
+                <objectAnimator
+                    android:propertyName="translateX"
+                    android:duration="150"
+                    android:valueFrom="0"
+                    android:valueTo="3"
+                    android:valueType="floatType"
+                    android:interpolator="@android:anim/overshoot_interpolator"/>
+                <objectAnimator
+                    android:propertyName="translateY"
+                    android:duration="150"
+                    android:valueFrom="0"
+                    android:valueTo="-1"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="translateX"
+                    android:startOffset="250"
+                    android:duration="150"
+                    android:valueFrom="3"
+                    android:valueTo="-3"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="translateY"
+                    android:startOffset="500"
+                    android:duration="150"
+                    android:valueFrom="-1"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="translateX"
+                    android:startOffset="500"
+                    android:duration="150"
+                    android:valueFrom="-3"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:anim/overshoot_interpolator"/>
+            </set>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_add.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_add.xml
new file mode 100644
index 000000000..c038152d6
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_add.xml
@@ -0,0 +1,70 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path_2"
+                android:pathData="M 7.16 2 C 5.792 2 4.479 2.544 3.511 3.511 C 2.544 4.479 2 5.792 2 7.16 L 2 16.84 C 2 18.208 2.544 19.521 3.511 20.489 C 4.479 21.456 5.792 22 7.16 22 L 16.84 22 C 18.208 22 19.521 21.456 20.489 20.489 C 21.456 19.521 22 18.208 22 16.84 L 22 7.16 C 22 5.792 21.456 4.479 20.489 3.511 C 19.521 2.544 18.208 2 16.84 2 Z M 4.02 7.16 C 4.02 5.43 5.42 4.02 7.16 4.02 L 16.84 4.02 C 18.57 4.02 19.98 5.42 19.98 7.16 L 19.98 16.84 C 19.98 18.57 18.58 19.98 16.84 19.98 L 7.16 19.98 C 6.328 19.98 5.528 19.649 4.94 19.06 C 4.351 18.472 4.02 17.672 4.02 16.84 Z"
+                android:fillColor="#FF000000"
+                android:fillType="evenOdd"/>
+            <group
+                android:name="group"
+                android:pivotX="12"
+                android:pivotY="12">
+                <path
+                    android:name="path_1"
+                    android:pathData="M 12 6.84 C 12.178 6.838 12.353 6.884 12.507 6.972 C 12.661 7.061 12.789 7.189 12.878 7.343 C 12.966 7.497 13.012 7.672 13.01 7.85 L 13.01 10.99 L 16.15 10.99 C 16.327 10.997 16.499 11.05 16.648 11.145 C 16.797 11.24 16.919 11.373 17 11.53 C 17.081 11.687 17.119 11.863 17.11 12.04 C 17.1 12.291 16.996 12.53 16.818 12.708 C 16.64 12.886 16.401 12.99 16.15 13 L 13.01 13 L 13.01 16.14 C 13.012 16.318 12.966 16.493 12.878 16.647 C 12.789 16.801 12.661 16.929 12.507 17.018 C 12.353 17.106 12.178 17.152 12 17.15 C 11.822 17.152 11.647 17.106 11.493 17.018 C 11.339 16.929 11.211 16.801 11.122 16.647 C 11.034 16.493 10.988 16.318 10.99 16.14 L 10.99 13 L 7.85 13 C 7.672 13.002 7.497 12.956 7.343 12.868 C 7.189 12.779 7.061 12.651 6.972 12.497 C 6.884 12.343 6.838 12.168 6.84 11.99 C 6.838 11.812 6.884 11.637 6.972 11.483 C 7.061 11.329 7.189 11.201 7.343 11.112 C 7.497 11.024 7.672 10.978 7.85 10.98 L 10.99 10.98 L 10.99 7.84 C 10.988 7.662 11.034 7.487 11.122 7.333 C 11.211 7.179 11.339 7.051 11.493 6.962 C 11.647 6.874 11.822 6.828 12 6.83 Z"
+                    android:fillColor="#FF000000"/>
+            </group>
+        </vector>
+    </aapt:attr>
+    <target android:name="path_2">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="225"
+                android:valueFrom="M 7.16 2 C 5.792 2 4.479 2.544 3.511 3.511 C 2.544 4.479 2 5.792 2 7.16 L 2 16.84 C 2 17.524 2.136 18.194 2.393 18.815 C 2.65 19.435 3.028 20.005 3.511 20.489 C 4.479 21.456 5.792 22 7.16 22 L 16.84 22 C 17.524 22 18.194 21.864 18.815 21.607 C 19.435 21.35 20.005 20.972 20.489 20.489 C 21.456 19.521 22 18.208 22 16.84 L 22 7.16 C 22 6.476 21.864 5.806 21.607 5.185 C 21.35 4.565 20.972 3.995 20.489 3.511 C 19.521 2.544 18.208 2 16.84 2 Z M 4.02 7.16 C 4.02 6.728 4.107 6.315 4.266 5.94 C 4.424 5.564 4.654 5.226 4.938 4.941 C 5.221 4.657 5.559 4.427 5.935 4.267 C 6.311 4.108 6.725 4.02 7.16 4.02 C 8.773 4.02 10.387 4.02 12 4.02 C 13.613 4.02 15.227 4.02 16.84 4.02 C 17.273 4.02 17.685 4.107 18.06 4.266 C 18.436 4.424 18.774 4.654 19.059 4.938 C 19.343 5.221 19.573 5.559 19.733 5.935 C 19.892 6.311 19.98 6.725 19.98 7.16 C 19.98 8.773 19.98 10.387 19.98 12 C 19.98 13.613 19.98 15.227 19.98 16.84 C 19.98 17.273 19.892 17.685 19.734 18.06 C 19.576 18.436 19.346 18.774 19.063 19.059 C 18.779 19.343 18.441 19.573 18.065 19.733 C 17.689 19.892 17.275 19.98 16.84 19.98 C 15.227 19.98 13.613 19.98 12 19.98 C 10.387 19.98 8.773 19.98 7.16 19.98 C 6.328 19.98 5.528 19.649 4.94 19.06 C 4.743 18.864 4.576 18.644 4.44 18.408 C 4.303 18.172 4.198 17.918 4.128 17.655 C 4.057 17.391 4.02 17.117 4.02 16.84 C 4.02 15.227 4.02 13.613 4.02 12 C 4.02 10.387 4.02 8.773 4.02 7.16"
+                android:valueTo="M 7 2 C 5.674 2 4.402 2.527 3.464 3.464 C 2.527 4.402 2 5.674 2 7 L 2 17 C 2 17.878 2.231 18.74 2.67 19.5 C 3.109 20.26 3.74 20.891 4.5 21.33 C 5.26 21.769 6.122 22 7 22 L 17 22 C 17.878 22 18.74 21.769 19.5 21.33 C 20.26 20.891 20.891 20.26 21.33 19.5 C 21.769 18.74 22 17.878 22 17 L 22 7 C 22 6.122 21.769 5.26 21.33 4.5 C 20.891 3.74 20.26 3.109 19.5 2.67 C 18.74 2.231 17.878 2 17 2 Z M 7.133 11.403 C 7.289 11.248 7.5 11.16 7.72 11.16 C 8.87 11.16 10.02 11.16 11.17 11.16 C 11.17 10.01 11.17 8.86 11.17 7.71 C 11.17 7.49 11.258 7.279 11.413 7.123 C 11.569 6.968 11.78 6.88 12 6.88 C 12.22 6.88 12.431 6.968 12.587 7.123 C 12.742 7.279 12.83 7.49 12.83 7.71 C 12.83 8.86 12.83 10.01 12.83 11.16 C 13.98 11.16 15.13 11.16 16.28 11.16 C 16.5 11.16 16.711 11.248 16.867 11.403 C 17.022 11.559 17.11 11.77 17.11 11.99 C 17.11 12.21 17.022 12.421 16.867 12.577 C 16.711 12.732 16.5 12.82 16.28 12.82 C 15.13 12.82 13.98 12.82 12.83 12.82 C 12.83 13.97 12.83 15.12 12.83 16.27 C 12.83 16.49 12.742 16.701 12.587 16.857 C 12.431 17.012 12.22 17.1 12 17.1 C 11.78 17.1 11.569 17.012 11.413 16.857 C 11.258 16.701 11.17 16.49 11.17 16.27 C 11.17 15.12 11.17 13.97 11.17 12.82 C 10.02 12.82 8.87 12.82 7.72 12.82 C 7.5 12.82 7.289 12.732 7.133 12.577 C 6.978 12.421 6.89 12.21 6.89 11.99 C 6.89 11.77 6.978 11.559 7.133 11.403"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+    <target android:name="group">
+        <aapt:attr name="android:animation">
+            <set>
+                <objectAnimator
+                    android:propertyName="scaleX"
+                    android:duration="300"
+                    android:valueFrom="1"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="scaleY"
+                    android:duration="300"
+                    android:valueFrom="1"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+            </set>
+        </aapt:attr>
+    </target>
+    <target android:name="path_1">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="fillAlpha"
+                android:startOffset="100"
+                android:duration="125"
+                android:valueFrom="1"
+                android:valueTo="0"
+                android:valueType="floatType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_bell_shake.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_bell_shake.xml
new file mode 100644
index 000000000..e8da19f3d
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_bell_shake.xml
@@ -0,0 +1,114 @@
+
+<!--
+  Copyright (c) 2024 Adevinta
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  SOFTWARE.
+  -->
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <group
+                android:name="group"
+                android:pivotX="12"
+                android:pivotY="12">
+                <path
+                    android:name="path"
+                    android:pathData="M 14.1 4.03 C 15.509 4.479 16.739 5.366 17.609 6.562 C 18.48 7.758 18.946 9.201 18.94 10.68 C 18.94 13.48 19.41 15.03 19.9 15.93 C 20.29 16.65 20.48 17.53 20.16 18.32 C 19.8 19.2 18.95 19.62 18.01 19.62 L 15.07 19.62 C 14.887 20.297 14.487 20.895 13.93 21.322 C 13.373 21.748 12.691 21.98 11.99 21.98 C 11.289 21.98 10.607 21.748 10.05 21.322 C 9.493 20.895 9.093 20.297 8.91 19.62 C 8.91 19.62 5.97 19.62 5.97 19.62 C 5.02 19.62 4.18 19.2 3.82 18.32 C 3.685 17.927 3.639 17.509 3.684 17.096 C 3.729 16.683 3.864 16.285 4.08 15.93 C 4.57 15.03 5.04 13.49 5.04 10.68 C 5.042 9.203 5.511 7.763 6.38 6.569 C 7.25 5.375 8.475 4.486 9.88 4.03 C 9.88 3.473 10.101 2.939 10.495 2.545 C 10.889 2.151 11.423 1.93 11.98 1.93 C 12.537 1.93 13.071 2.151 13.465 2.545 C 13.859 2.939 14.08 3.473 14.08 4.03 Z M 12 5.72 C 13.31 5.72 14.56 6.24 15.48 7.17 C 16.402 8.101 16.919 9.36 16.92 10.67 C 16.92 13.69 17.43 15.6 18.13 16.88 C 18.35 17.29 18.3 17.51 18.29 17.54 C 18.28 17.57 18.2 17.59 18.01 17.59 L 5.98 17.59 C 5.8 17.59 5.72 17.55 5.7 17.54 C 5.68 17.53 5.64 17.29 5.86 16.88 C 6.56 15.59 7.07 13.68 7.07 10.66 C 7.061 9.792 7.283 8.937 7.713 8.183 C 8.143 7.429 8.766 6.803 9.517 6.368 C 10.268 5.934 11.122 5.706 11.99 5.71 Z"
+                    android:fillColor="#FF000000"
+                    android:fillType="evenOdd"/>
+            </group>
+        </vector>
+    </aapt:attr>
+    <target android:name="group">
+        <aapt:attr name="android:animation">
+            <set>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:duration="100"
+                    android:valueFrom="0"
+                    android:valueTo="10"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="100"
+                    android:duration="100"
+                    android:valueFrom="10"
+                    android:valueTo="-10"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="200"
+                    android:duration="100"
+                    android:valueFrom="-10"
+                    android:valueTo="8"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="300"
+                    android:duration="100"
+                    android:valueFrom="8"
+                    android:valueTo="-8"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="400"
+                    android:duration="100"
+                    android:valueFrom="-8"
+                    android:valueTo="4"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="500"
+                    android:duration="100"
+                    android:valueFrom="4"
+                    android:valueTo="-4"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="600"
+                    android:duration="100"
+                    android:valueFrom="-4"
+                    android:valueTo="2"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:startOffset="700"
+                    android:duration="100"
+                    android:valueFrom="2"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+            </set>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_like.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_like.xml
new file mode 100644
index 000000000..b7f5e50dc
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_like.xml
@@ -0,0 +1,28 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path"
+                android:pathData="M 16.28 3 C 14.56 3 13.04 3.83 12 5.11 C 11.489 4.461 10.84 3.935 10.099 3.57 C 9.359 3.204 8.546 3.01 7.72 3 C 4.51 3 2 5.85 2 9.24 C 2.045 11.241 2.737 13.174 3.97 14.75 C 5.84 17.22 8.35 18.86 10.64 20.35 L 10.66 20.35 L 11.39 20.84 C 11.71 21.05 12.12 21.06 12.45 20.86 L 13.08 20.47 L 13.1 20.47 C 15.49 18.99 18.12 17.37 20.05 14.79 C 21.279 13.202 21.963 11.258 22 9.25 C 22 5.85 19.49 3.02 16.28 3.02 Z M 7.71 5.12 C 8.442 5.142 9.152 5.381 9.748 5.806 C 10.344 6.232 10.801 6.825 11.06 7.51 C 11.22 7.89 11.58 8.15 11.99 8.15 C 12.4 8.15 12.76 7.9 12.92 7.51 C 13.18 6.823 13.638 6.229 14.236 5.804 C 14.834 5.378 15.546 5.14 16.28 5.12 C 18.27 5.12 19.98 6.91 19.97 9.25 C 19.97 11.25 18.99 12.75 18.45 13.49 C 16.78 15.74 14.47 17.16 12.02 18.68 L 11.95 18.72 L 11.74 18.59 C 9.41 17.07 7.2 15.62 5.56 13.45 C 4.603 12.256 4.062 10.78 4.02 9.25 C 4.02 6.92 5.72 5.12 7.72 5.12 Z"
+                android:fillColor="#FF000000"/>
+        </vector>
+    </aapt:attr>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="300"
+                android:valueFrom="M 7.72 5.12 C 5.72 5.12 4.02 6.92 4.02 9.25 C 4.062 10.78 4.603 12.256 5.56 13.45 C 7.2 15.62 9.41 17.07 11.74 18.59 L 11.845 18.655 C 11.88 18.677 11.915 18.698 11.95 18.72 L 12.02 18.68 C 14.47 17.16 16.78 15.74 18.45 13.49 C 18.99 12.75 19.97 11.25 19.97 9.25 C 19.98 6.91 18.27 5.12 16.28 5.12 C 15.546 5.14 14.834 5.378 14.236 5.804 C 13.638 6.229 13.18 6.823 12.92 7.51 C 12.76 7.9 12.4 8.15 11.99 8.15 C 11.58 8.15 11.22 7.89 11.06 7.51 C 10.801 6.825 10.344 6.232 9.748 5.806 C 9.152 5.381 8.442 5.142 7.71 5.12 L 7.72 5.12 M 12 5.11 C 13.04 3.83 14.56 3 16.28 3 L 16.28 3.02 C 19.49 3.02 22 5.85 22 9.25 C 21.963 11.258 21.279 13.202 20.05 14.79 C 18.12 17.37 15.49 18.99 13.1 20.47 L 13.08 20.47 L 12.45 20.86 C 12.12 21.06 11.71 21.05 11.39 20.84 L 10.66 20.35 L 10.64 20.35 C 8.35 18.86 5.84 17.22 3.97 14.75 C 2.737 13.174 2.045 11.241 2 9.24 C 2 5.85 4.51 3 7.72 3 C 8.546 3.01 9.359 3.204 10.099 3.57 C 10.84 3.935 11.489 4.461 12 5.11"
+                android:valueTo="M 7.61 3 C 4.47 3 2 5.8 2 9.16 C 2.042 11.158 2.733 13.09 3.97 14.66 C 5.86 17.17 8.4 18.84 10.75 20.38 L 11.51 20.88 C 11.76 21.04 12.07 21.05 12.33 20.89 L 12.98 20.49 C 15.44 18.97 18.1 17.33 20.05 14.7 C 21.281 13.112 21.965 11.168 22 9.16 C 22 5.8 19.53 3.01 16.39 3.01 C 15.479 3.01 14.622 3.248 13.866 3.669 C 13.328 3.967 12.842 4.357 12.423 4.819 C 12.273 4.984 12.132 5.158 12 5.34 C 11.849 5.123 11.683 4.918 11.503 4.726 C 11.095 4.291 10.617 3.924 10.087 3.643 C 9.324 3.238 8.474 3.021 7.61 3.01 L 7.61 3 M 12 11.93 C 12 11.93 12 11.93 12 11.93 L 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93 L 12 11.93 L 12 11.93 C 12 11.93 12 11.93 12 11.93 L 12 11.93 L 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93 C 12 11.93 12 11.93 12 11.93"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_message.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_message.xml
new file mode 100644
index 000000000..567ff18b4
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_message.xml
@@ -0,0 +1,29 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path"
+                android:pathData="M 2 6.18 C 2 3.84 3.9 2 6.21 2 L 17.71 2 C 18.461 2 19.199 2.198 19.85 2.573 C 20.501 2.949 21.041 3.489 21.417 4.14 C 21.792 4.791 21.99 5.529 21.99 6.28 L 21.99 20.98 C 21.989 21.231 21.895 21.474 21.726 21.66 C 21.557 21.847 21.325 21.964 21.075 21.99 C 20.824 22.016 20.573 21.948 20.37 21.8 L 16.71 19.06 L 6.3 19.06 C 5.169 19.06 4.082 18.612 3.281 17.813 C 2.479 17.015 2.025 15.931 2.02 14.8 C 2.01 12.28 2 8.77 2.01 6.17 Z M 16.9 8.2 L 7.1 8.2 C 6.884 8.201 6.674 8.133 6.499 8.006 C 6.324 7.88 6.194 7.701 6.127 7.496 C 6.06 7.291 6.06 7.069 6.127 6.864 C 6.194 6.659 6.324 6.48 6.499 6.354 C 6.674 6.227 6.884 6.159 7.1 6.16 L 16.9 6.16 C 17.46 6.16 17.92 6.61 17.92 7.18 C 17.92 7.75 17.47 8.2 16.9 8.2 M 16.9 11.39 L 7.1 11.39 C 6.884 11.391 6.674 11.323 6.499 11.196 C 6.324 11.07 6.194 10.891 6.127 10.686 C 6.06 10.481 6.06 10.259 6.127 10.054 C 6.194 9.849 6.324 9.67 6.499 9.544 C 6.674 9.417 6.884 9.349 7.1 9.35 L 16.9 9.35 C 17.46 9.35 17.92 9.8 17.92 10.37 C 17.92 10.94 17.47 11.39 16.9 11.39 M 6.08 13.64 C 6.08 13.08 6.53 12.62 7.1 12.62 L 13.63 12.62 C 14.19 12.62 14.65 13.07 14.65 13.64 C 14.65 14.21 14.2 14.66 13.63 14.66 L 7.1 14.66 C 6.54 14.66 6.08 14.21 6.08 13.64"
+                android:fillColor="#000000"
+                android:fillType="evenOdd"/>
+        </vector>
+    </aapt:attr>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="300"
+                android:valueFrom="M 2 6.18 C 2 3.84 3.9 2 6.21 2 L 17.71 2 C 18.461 2 19.199 2.198 19.85 2.573 C 20.501 2.949 21.041 3.489 21.417 4.14 C 21.792 4.791 21.99 5.529 21.99 6.28 L 21.99 20.98 C 21.989 21.231 21.895 21.474 21.726 21.66 C 21.557 21.847 21.325 21.964 21.075 21.99 C 20.824 22.016 20.573 21.948 20.37 21.8 L 16.71 19.06 L 6.3 19.06 C 5.169 19.06 4.082 18.612 3.281 17.813 C 2.479 17.015 2.025 15.931 2.02 14.8 C 2.01 12.28 2 8.77 2.01 6.17 Z M 6.08 13.64 C 6.08 14.21 6.54 14.66 7.1 14.66 L 13.63 14.66 C 13.899 14.66 14.142 14.559 14.323 14.393 C 14.436 14.29 14.524 14.161 14.581 14.015 C 14.626 13.899 14.65 13.773 14.65 13.64 C 14.65 13.07 14.19 12.62 13.63 12.62 L 7.521 12.62 L 7.31 12.62 C 7.24 12.62 7.17 12.62 7.1 12.62 C 6.53 12.62 6.08 13.08 6.08 13.64 M 16.9 8.2 L 7.1 8.2 C 6.884 8.201 6.674 8.133 6.499 8.006 C 6.324 7.88 6.194 7.701 6.127 7.496 C 6.06 7.291 6.06 7.069 6.127 6.864 C 6.194 6.659 6.324 6.48 6.499 6.354 C 6.674 6.227 6.884 6.159 7.1 6.16 L 16.9 6.16 C 17.46 6.16 17.92 6.61 17.92 7.18 C 17.92 7.465 17.808 7.72 17.624 7.904 C 17.44 8.088 17.185 8.2 16.9 8.2 M 16.9 11.39 L 7.1 11.39 C 6.884 11.391 6.674 11.323 6.499 11.196 C 6.324 11.07 6.194 10.891 6.127 10.686 C 6.06 10.481 6.06 10.259 6.127 10.054 C 6.194 9.849 6.324 9.67 6.499 9.544 C 6.674 9.417 6.884 9.349 7.1 9.35 L 16.9 9.35 C 17.46 9.35 17.92 9.8 17.92 10.37 C 17.92 10.655 17.808 10.91 17.624 11.094 C 17.44 11.277 17.185 11.39 16.9 11.39 M 10.365 13.635 C 10.365 13.635 10.365 13.635 10.365 13.635 L 10.365 13.635 C 10.365 13.635 10.365 13.635 10.365 13.635 C 10.365 13.635 10.365 13.635 10.365 13.635 L 10.365 13.635 C 10.365 13.635 10.365 13.635 10.365 13.635 L 10.365 13.635"
+                android:valueTo="M 2 6.18 C 2 3.84 3.9 2 6.22 2 L 17.72 2 C 18.507 2 19.244 2.213 19.879 2.585 C 20.513 2.957 21.043 3.487 21.415 4.121 C 21.787 4.756 22 5.493 22 6.28 L 22 13.63 C 22 16.08 22 18.53 22 20.98 C 22 21.37 21.78 21.72 21.44 21.89 C 21.1 22.06 20.68 22.03 20.38 21.79 L 16.71 19.06 L 6.3 19.06 C 5.12 19.06 4.053 18.585 3.279 17.816 C 2.505 17.047 2.025 15.985 2.02 14.81 C 2.013 11.933 2.007 9.057 2 6.18 Z M 4.05 14.8 C 4.05 16.03 5.05 17.03 6.3 17.03 L 17.05 17.03 C 17.27 17.03 17.48 17.1 17.65 17.23 C 18.423 17.807 19.197 18.383 19.97 18.96 C 19.97 14.733 19.97 10.507 19.97 6.28 C 19.97 5.04 18.97 4.03 17.72 4.03 L 6.22 4.03 L 6.22 4.03 C 5 4.03 4.04 5 4.03 6.18 C 4.03 8.78 4.03 12.28 4.05 14.8 M 16.9 8.2 L 12 8.2 C 10.367 8.2 8.733 8.2 7.1 8.2 C 6.913 8.2 6.738 8.149 6.587 8.06 C 6.436 7.971 6.309 7.844 6.22 7.693 C 6.131 7.542 6.08 7.367 6.08 7.18 C 6.08 6.62 6.54 6.17 7.1 6.17 L 16.9 6.17 C 17.46 6.17 17.92 6.62 17.92 7.18 C 17.92 7.74 17.46 8.2 16.9 8.2 C 16.9 8.2 16.9 8.2 16.9 8.2 M 16.9 11.38 L 12 11.38 C 10.367 11.38 8.733 11.38 7.1 11.38 C 6.913 11.38 6.738 11.33 6.587 11.243 C 6.436 11.155 6.309 11.03 6.22 10.881 C 6.131 10.731 6.08 10.557 6.08 10.37 C 6.08 9.81 6.54 9.35 7.1 9.35 L 16.9 9.35 C 17.46 9.35 17.92 9.81 17.92 10.37 C 17.92 10.93 17.46 11.38 16.9 11.38 C 16.9 11.38 16.9 11.38 16.9 11.38 M 6.08 13.63 C 6.08 13.07 6.54 12.62 7.1 12.62 L 13.63 12.62 C 14.19 12.62 14.65 13.07 14.65 13.63 C 14.65 14.19 14.19 14.65 13.63 14.65 L 7.1 14.65 C 6.54 14.65 6.08 14.19 6.08 13.63 L 6.08 13.63"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_animated_search.xml b/spark-icons/src/main/res/drawable/spark_icons_animated_search.xml
new file mode 100644
index 000000000..41f628c92
--- /dev/null
+++ b/spark-icons/src/main/res/drawable/spark_icons_animated_search.xml
@@ -0,0 +1,59 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="24dp"
+            android:height="24dp"
+            android:viewportWidth="24"
+            android:viewportHeight="24">
+            <path
+                android:name="path_2"
+                android:pathData="M 10.5 3.95 C 8.763 3.95 7.096 4.641 5.868 5.868 C 4.641 7.096 3.95 8.763 3.95 10.5 C 3.95 12.237 4.641 13.904 5.868 15.132 C 7.096 16.359 8.763 17.05 10.5 17.05 C 12.237 17.05 13.904 16.359 15.132 15.132 C 16.359 13.904 17.05 12.237 17.05 10.5 C 17.05 8.763 16.359 7.096 15.132 5.868 C 13.904 4.641 12.237 3.95 10.5 3.95 M 2 10.5 C 2 8.247 2.896 6.083 4.49 4.49 C 6.083 2.896 8.247 2 10.5 2 C 12.753 2 14.917 2.896 16.51 4.49 C 18.104 6.083 19 8.247 19 10.5 C 19 12.753 18.104 14.917 16.51 16.51 C 14.917 18.104 12.753 19 10.5 19 C 8.247 19 6.083 18.104 4.49 16.51 C 2.896 14.917 2 12.753 2 10.5"
+                android:fillColor="#FF000000"
+                android:fillType="evenOdd"/>
+            <path
+                android:name="path_3"
+                android:pathData="M 15.13 15.13 C 15.313 14.948 15.562 14.846 15.82 14.846 C 16.078 14.846 16.327 14.948 16.51 15.13 L 21.71 20.33 C 21.879 20.47 21.996 20.663 22.042 20.877 C 22.088 21.092 22.061 21.315 21.965 21.513 C 21.869 21.71 21.71 21.869 21.513 21.965 C 21.315 22.061 21.092 22.088 20.877 22.042 C 20.663 21.996 20.47 21.879 20.33 21.71 L 15.13 16.51 C 14.948 16.327 14.846 16.078 14.846 15.82 C 14.846 15.562 14.948 15.313 15.13 15.13"
+                android:fillColor="#FF000000"
+                android:fillType="evenOdd"/>
+            <group
+                android:name="group"
+                android:pivotX="16"
+                android:pivotY="16">
+                <path
+                    android:name="path_4"
+                    android:pathData="M 15.75 10.5 C 15.75 11.892 15.196 13.228 14.212 14.212 C 13.228 15.196 11.892 15.75 10.5 15.75 C 9.108 15.75 7.772 15.196 6.788 14.212 C 5.804 13.228 5.25 11.892 5.25 10.5 C 5.25 9.108 5.804 7.772 6.788 6.788 C 7.772 5.804 9.108 5.25 10.5 5.25 C 11.892 5.25 13.228 5.804 14.212 6.788 C 15.196 7.772 15.75 9.108 15.75 10.5"
+                    android:fillColor="#FF000000"/>
+            </group>
+        </vector>
+    </aapt:attr>
+    <target android:name="group">
+        <aapt:attr name="android:animation">
+            <set>
+                <objectAnimator
+                    android:propertyName="scaleX"
+                    android:duration="275"
+                    android:valueFrom="1"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="scaleY"
+                    android:duration="275"
+                    android:valueFrom="1"
+                    android:valueTo="0"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+                <objectAnimator
+                    android:propertyName="rotation"
+                    android:duration="300"
+                    android:valueFrom="0"
+                    android:valueTo="-90"
+                    android:valueType="floatType"
+                    android:interpolator="@android:interpolator/fast_out_slow_in"/>
+            </set>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/spark-icons/src/main/res/drawable/spark_icons_message_fill.xml b/spark-icons/src/main/res/drawable/spark_icons_message_fill.xml
index f908e270e..16970dd0f 100644
--- a/spark-icons/src/main/res/drawable/spark_icons_message_fill.xml
+++ b/spark-icons/src/main/res/drawable/spark_icons_message_fill.xml
@@ -28,4 +28,4 @@
       android:fillColor="#FF000000"
       android:pathData="M2,6.18C2,3.84 3.9,2 6.21,2h11.5a4.28,4.28 0,0 1,4.28 4.28v14.7a1.02,1.02 0,0 1,-1.62 0.82l-3.66,-2.74H6.3a4.28,4.28 0,0 1,-4.28 -4.26c-0.01,-2.52 -0.02,-6.03 -0.01,-8.63ZM16.9,8.2H7.1a1.02,1.02 0,1 1,0 -2.04h9.8c0.56,0 1.02,0.45 1.02,1.02S17.47,8.2 16.9,8.2m0,3.19H7.1a1.02,1.02 0,1 1,0 -2.04h9.8c0.56,0 1.02,0.45 1.02,1.02s-0.45,1.02 -1.02,1.02M6.08,13.64c0,-0.56 0.45,-1.02 1.02,-1.02h6.53c0.56,0 1.02,0.45 1.02,1.02s-0.45,1.02 -1.02,1.02H7.1c-0.56,0 -1.02,-0.45 -1.02,-1.02"
       android:fillType="evenOdd"/>
-</vector>
+</vector>
\ No newline at end of file
diff --git a/spark-icons/src/main/res/drawable/spark_icons_message_outline.xml b/spark-icons/src/main/res/drawable/spark_icons_message_outline.xml
index 526a30c51..1d5ad6990 100644
--- a/spark-icons/src/main/res/drawable/spark_icons_message_outline.xml
+++ b/spark-icons/src/main/res/drawable/spark_icons_message_outline.xml
@@ -25,7 +25,16 @@
     android:viewportWidth="24"
     android:viewportHeight="24">
   <path
-      android:fillColor="#FF000000"
-      android:pathData="M2,6.18C2,3.84 3.9,2 6.21,2h11.5a4.28,4.28 0,0 1,4.28 4.28v14.7a1.02,1.02 0,0 1,-1.62 0.82l-3.66,-2.74L6.3,19.06a4.28,4.28 0,0 1,-4.28 -4.26c-0.01,-2.52 -0.02,-6.03 -0.01,-8.63ZM6.21,4.03c-1.22,0 -2.18,0.96 -2.18,2.15l0.01,8.62a2.24,2.24 0,0 0,2.25 2.23h10.75c0.22,0 0.43,0.07 0.61,0.2l2.31,1.73L19.96,6.28a2.25,2.25 0,0 0,-2.25 -2.25zM16.89,8.2L7.1,8.2a1.02,1.02 0,1 1,0 -2.04h9.8c0.56,0 1.02,0.45 1.02,1.02S17.47,8.2 16.9,8.2ZM16.89,11.39L7.1,11.39a1.02,1.02 0,1 1,0 -2.04h9.8c0.56,0 1.02,0.45 1.02,1.02s-0.45,1.02 -1.02,1.02ZM6.07,13.64c0,-0.56 0.45,-1.02 1.02,-1.02h6.53c0.56,0 1.02,0.45 1.02,1.02s-0.45,1.02 -1.02,1.02L7.09,14.66c-0.56,0 -1.02,-0.45 -1.02,-1.02"
-      android:fillType="evenOdd"/>
+      android:fillColor="#FF4F6076"
+      android:pathData="M16.9 8.2H7.1c-0.56 0-1.02-0.46-1.02-1.02S6.54 6.17 7.1 6.17h9.8c0.56 0 1.02 0.45 1.02 1.01S17.46 8.2 16.9 8.2Z"/>
+  <path
+      android:fillColor="#FF4F6076"
+      android:pathData="M16.9 11.38H7.1c-0.56 0-1.02-0.45-1.02-1.01S6.54 9.35 7.1 9.35h9.8c0.56 0 1.02 0.46 1.02 1.02s-0.46 1.01-1.02 1.01Z"/>
+  <path
+      android:fillColor="#FF4F6076"
+      android:pathData="M6.08 13.63c0-0.56 0.46-1.01 1.02-1.01h6.53c0.56 0 1.02 0.45 1.02 1.01s-0.46 1.02-1.02 1.02H7.1c-0.56 0-1.02-0.46-1.02-1.02Z"/>
+  <path
+      android:fillColor="#FF4F6076"
+      android:fillType="evenOdd"
+      android:pathData="M2 6.18C2 3.84 3.9 2 6.22 2h11.5C20.08 2 22 3.92 22 6.28v14.7c0 0.39-0.22 0.74-0.56 0.91-0.34 0.17-0.76 0.14-1.06-0.1l-3.67-2.73H6.3c-2.36 0-4.27-1.9-4.28-4.25L2 6.18Zm4.22-2.15C5 4.03 4.04 5 4.03 6.18c0 2.6 0 6.1 0.02 8.62 0 1.23 1 2.23 2.25 2.23h10.75c0.22 0 0.43 0.07 0.6 0.2l2.32 1.73V6.28c0-1.24-1-2.25-2.25-2.25H6.22Z"/>
 </vector>
diff --git a/spark/build.gradle.kts b/spark/build.gradle.kts
index 5942a9634..6e2d8de26 100644
--- a/spark/build.gradle.kts
+++ b/spark/build.gradle.kts
@@ -66,6 +66,7 @@ dependencies {
     implementation(libs.androidx.savedstate)
     implementation(libs.androidx.window)
 
+    api(libs.androidx.compose.animation.graphics)
     api(libs.androidx.compose.foundation)
     api(libs.androidx.compose.material3)
     api(libs.androidx.compose.material3.windowSizeClass)
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/Button.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/Button.kt
index 4495e4e1b..15cbe7cbd 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/Button.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/Button.kt
@@ -79,6 +79,7 @@ internal fun BaseSparkButton(
     isLoading: Boolean = false,
     contentPadding: PaddingValues = SparkButtonDefaults.buttonContentPadding(size),
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     Button(
@@ -113,6 +114,7 @@ internal fun BaseSparkButton(
                     .size(SparkButtonDefaults.IconSize)
                     .testTag("buttonIcon"),
                 contentDescription = null, // button text should be enough for context
+                atEnd = atEnd,
             )
             Spacer(Modifier.width(SparkButtonDefaults.IconSpacing))
         }
@@ -130,6 +132,7 @@ internal fun BaseSparkButton(
                     .size(SparkButtonDefaults.IconSize)
                     .testTag("buttonIcon"),
                 contentDescription = null, // button text should be enough for context
+                atEnd = atEnd,
             )
         }
     }
@@ -151,6 +154,7 @@ internal fun SparkButton(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     BaseSparkButton(
         onClick = onClick,
@@ -165,6 +169,7 @@ internal fun SparkButton(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     ) {
         Text(text = text)
     }
@@ -186,6 +191,7 @@ internal fun SparkButton(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     BaseSparkButton(
         onClick = onClick,
@@ -200,6 +206,7 @@ internal fun SparkButton(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     ) {
         Text(text = text)
     }
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonContrast.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonContrast.kt
index bb40ba1fa..839f810bb 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonContrast.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonContrast.kt
@@ -79,6 +79,7 @@ public fun ButtonContrast(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     val containerColor = SparkTheme.colors.surface
@@ -107,6 +108,7 @@ public fun ButtonContrast(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -145,6 +147,7 @@ public fun ButtonContrast(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val containerColor = SparkTheme.colors.surface
     val colors = intent.colors()
@@ -172,6 +175,7 @@ public fun ButtonContrast(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -209,6 +213,7 @@ public fun ButtonContrast(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val containerColor = SparkTheme.colors.surface
     val colors = intent.colors()
@@ -235,6 +240,7 @@ public fun ButtonContrast(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonFilled.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonFilled.kt
index 0b75c2e54..614d5438b 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonFilled.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonFilled.kt
@@ -149,6 +149,7 @@ public fun ButtonFilled(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val backgroundColor by animateColorAsState(
         targetValue = intent.colors().color,
@@ -177,6 +178,7 @@ public fun ButtonFilled(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -214,6 +216,7 @@ public fun ButtonFilled(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val backgroundColor by animateColorAsState(
         targetValue = intent.colors().color,
@@ -239,6 +242,7 @@ public fun ButtonFilled(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonGhost.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonGhost.kt
index e04197214..34a599b54 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonGhost.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonGhost.kt
@@ -82,6 +82,7 @@ public fun ButtonGhost(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     val contentColor by animateColorAsState(
@@ -109,6 +110,7 @@ public fun ButtonGhost(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -148,6 +150,7 @@ public fun ButtonGhost(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val contentColor by animateColorAsState(
         targetValue = intent.colors().color,
@@ -175,6 +178,7 @@ public fun ButtonGhost(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -213,6 +217,7 @@ public fun ButtonGhost(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val contentColor by animateColorAsState(
         targetValue = intent.colors().onColor,
@@ -240,6 +245,7 @@ public fun ButtonGhost(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonOutlined.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonOutlined.kt
index 2c9542318..54c7dc679 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonOutlined.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonOutlined.kt
@@ -76,6 +76,7 @@ public fun ButtonOutlined(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     val contentColor by animateColorAsState(
@@ -101,6 +102,7 @@ public fun ButtonOutlined(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -138,6 +140,7 @@ public fun ButtonOutlined(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val contentColor by animateColorAsState(
         targetValue = intent.colors().color,
@@ -163,6 +166,7 @@ public fun ButtonOutlined(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -199,6 +203,7 @@ public fun ButtonOutlined(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val contentColor by animateColorAsState(
         targetValue = intent.colors().onColor,
@@ -220,6 +225,7 @@ public fun ButtonOutlined(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonTinted.kt b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonTinted.kt
index db85a30f0..d5152c4a2 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonTinted.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/buttons/ButtonTinted.kt
@@ -77,6 +77,7 @@ public fun ButtonTinted(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     val backgroundColor by animateColorAsState(
@@ -105,6 +106,7 @@ public fun ButtonTinted(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -143,6 +145,7 @@ public fun ButtonTinted(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val backgroundColor by animateColorAsState(
         targetValue = intent.colors().containerColor,
@@ -171,6 +174,7 @@ public fun ButtonTinted(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
@@ -208,6 +212,7 @@ public fun ButtonTinted(
     iconSide: IconSide = IconSide.START,
     isLoading: Boolean = false,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val colors = ButtonDefaults.buttonColors(
         containerColor = intent.colors().color,
@@ -226,6 +231,7 @@ public fun ButtonTinted(
         iconSide = iconSide,
         isLoading = isLoading,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButton.kt b/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButton.kt
index aed2ab5aa..c27664b6d 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButton.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButton.kt
@@ -92,12 +92,14 @@ internal fun SparkIconButton(
     border: BorderStroke? = null,
     contentDescription: String? = null,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val content: @Composable () -> Unit = {
         Icon(
             sparkIcon = icon,
             contentDescription = contentDescription,
             size = size.iconSize,
+            atEnd = atEnd,
         )
     }
     Box(modifier = modifier) {
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButtonFilled.kt b/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButtonFilled.kt
index 875e8182c..fef17f51d 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButtonFilled.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/iconbuttons/IconButtonFilled.kt
@@ -71,6 +71,7 @@ public fun IconButtonFilled(
     size: IconButtonSize = IconButtonDefaults.DefaultSize,
     contentDescription: String? = null,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    atEnd: Boolean = false,
 ) {
     val colors = IconButtonDefaults.filledIconButtonColors(intent.colors())
     SparkIconButton(
@@ -84,6 +85,7 @@ public fun IconButtonFilled(
         size = size,
         contentDescription = contentDescription,
         interactionSource = interactionSource,
+        atEnd = atEnd,
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/icons/Icons.kt b/spark/src/main/kotlin/com/adevinta/spark/components/icons/Icons.kt
index ccb302526..5844a7988 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/icons/Icons.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/icons/Icons.kt
@@ -22,6 +22,10 @@
 package com.adevinta.spark.components.icons
 
 import androidx.appcompat.content.res.AppCompatResources.getDrawable
+import androidx.compose.animation.graphics.ExperimentalAnimationGraphicsApi
+import androidx.compose.animation.graphics.res.animatedVectorResource
+import androidx.compose.animation.graphics.res.rememberAnimatedVectorPainter
+import androidx.compose.animation.graphics.vector.AnimatedImageVector
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.size
@@ -71,9 +75,10 @@ public fun Icon(
     modifier: Modifier = Modifier,
     tint: Color = IconDefaults.intent.color(),
     size: IconSize? = null,
+    atEnd: Boolean = false,
 ) {
     MaterialIcon(
-        painter = rememberSparkIconPainter(sparkIcon),
+        painter = rememberSparkIconPainter(sparkIcon, atEnd),
         contentDescription = contentDescription,
         modifier = modifier
             .sparkUsageOverlay()
@@ -186,10 +191,15 @@ public fun Icon(
     )
 }
 
+@OptIn(ExperimentalAnimationGraphicsApi::class)
 @Composable
-public fun rememberSparkIconPainter(sparkIcon: SparkIcon): Painter = when (sparkIcon) {
+public fun rememberSparkIconPainter(sparkIcon: SparkIcon, atEnd: Boolean = false): Painter = when (sparkIcon) {
     is SparkIcon.Vector -> rememberVectorPainter(sparkIcon.imageVector)
     is SparkIcon.DrawableRes -> rememberDrawablePainter(getDrawable(LocalContext.current, sparkIcon.drawableId))
+    is SparkIcon.AnimatedDrawableRes -> {
+        val icon = AnimatedImageVector.animatedVectorResource(sparkIcon.drawableId)
+        rememberAnimatedVectorPainter(icon, atEnd)
+    }
 }
 
 @Composable
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/tags/Tag.kt b/spark/src/main/kotlin/com/adevinta/spark/components/tags/Tag.kt
index 7ce6c604d..54d18f910 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/tags/Tag.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/tags/Tag.kt
@@ -68,6 +68,7 @@ internal fun BaseSparkTag(
     border: BorderStroke? = null,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     Surface(
@@ -103,6 +104,7 @@ internal fun BaseSparkTag(
                                 modifier = Modifier.size(LeadingIconSize),
                                 contentDescription = null, // The tag is associated with a mandatory label so it's okay
                                 tint = tint ?: LocalContentColor.current,
+                                atEnd = atEnd,
                             )
                         }
                     } else {
@@ -127,6 +129,7 @@ internal fun SparkTag(
     border: BorderStroke? = null,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     BaseSparkTag(
@@ -135,6 +138,7 @@ internal fun SparkTag(
         border = border,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -148,6 +152,7 @@ internal fun SparkTag(
     border: BorderStroke? = null,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     require(text.isNotBlank() || leadingIcon != null) {
         "text can be blank only when there is an icon"
@@ -158,6 +163,7 @@ internal fun SparkTag(
         border = border,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
     ) {
         if (text.isNotBlank()) {
             Text(text = text)
@@ -174,6 +180,7 @@ internal fun SparkTag(
     border: BorderStroke? = null,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     require(text.isNotBlank() || leadingIcon != null) {
         "text can be blank only when there is an icon"
@@ -184,6 +191,7 @@ internal fun SparkTag(
         border = border,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
     ) {
         if (text.isNotBlank()) {
             Text(text = text)
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagFilled.kt b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagFilled.kt
index 7b8dfb6b0..a2f117757 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagFilled.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagFilled.kt
@@ -50,6 +50,7 @@ public fun TagFilled(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     SparkTag(
@@ -57,6 +58,7 @@ public fun TagFilled(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -76,6 +78,7 @@ public fun TagFilled(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     SparkTag(
         colors = TagDefaults.filledColors(intent),
@@ -83,6 +86,7 @@ public fun TagFilled(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
     )
 }
 
@@ -101,6 +105,7 @@ public fun TagFilled(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     SparkTag(
         colors = TagDefaults.filledColors(intent),
@@ -108,6 +113,7 @@ public fun TagFilled(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
     )
 }
 
@@ -122,6 +128,7 @@ public fun TagFilled(
     colors: TagColors = TagDefaults.filledColors(TagIntent.Main),
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     BaseSparkTag(
@@ -129,6 +136,7 @@ public fun TagFilled(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagOutlined.kt b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagOutlined.kt
index 23bf80900..e238a7edf 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagOutlined.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagOutlined.kt
@@ -52,6 +52,7 @@ public fun TagOutlined(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     val colors = TagDefaults.outlinedColors(intent)
@@ -64,6 +65,7 @@ public fun TagOutlined(
         ),
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -83,6 +85,7 @@ public fun TagOutlined(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     val colors = TagDefaults.outlinedColors(intent)
     SparkTag(
@@ -95,6 +98,7 @@ public fun TagOutlined(
         ),
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd
     )
 }
 
@@ -113,6 +117,7 @@ public fun TagOutlined(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     val colors = TagDefaults.outlinedColors(intent)
     SparkTag(
@@ -125,6 +130,7 @@ public fun TagOutlined(
         ),
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd
     )
 }
 
diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagTinted.kt b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagTinted.kt
index 3d9f6b986..0d07dddb8 100644
--- a/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagTinted.kt
+++ b/spark/src/main/kotlin/com/adevinta/spark/components/tags/TagTinted.kt
@@ -50,6 +50,7 @@ public fun TagTinted(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     SparkTag(
@@ -57,6 +58,7 @@ public fun TagTinted(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -76,12 +78,14 @@ public fun TagTinted(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     SparkTag(
         colors = TagDefaults.tintedColors(intent),
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         text = text,
     )
 }
@@ -101,12 +105,14 @@ public fun TagTinted(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
 ) {
     SparkTag(
         colors = TagDefaults.tintedColors(intent),
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         text = text,
     )
 }
@@ -121,6 +127,7 @@ public fun TagTonal(
     intent: TagIntent = TagIntent.Basic,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     BaseSparkTag(
@@ -128,6 +135,7 @@ public fun TagTonal(
         modifier = modifier,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -141,6 +149,7 @@ public fun TagCriteria(
     modifier: Modifier = Modifier,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     TagTonal(
@@ -148,6 +157,7 @@ public fun TagCriteria(
         intent = TagIntent.Neutral,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }
@@ -161,6 +171,7 @@ public fun TagService(
     modifier: Modifier = Modifier,
     leadingIcon: SparkIcon? = null,
     tint: Color? = null,
+    atEnd: Boolean = false,
     content: @Composable RowScope.() -> Unit,
 ) {
     TagTonal(
@@ -168,6 +179,7 @@ public fun TagService(
         intent = TagIntent.Main,
         leadingIcon = leadingIcon,
         tint = tint,
+        atEnd = atEnd,
         content = content,
     )
 }