---
title: "unveilIn"
description: "This animates an unveiling scrim over the content as it enters."
type: "function"
---

<div class='type'>Function</div>


<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


```kotlin
@ExperimentalAnimationApi
public fun unveilIn(
    animationSpec: FiniteAnimationSpec<Color> = spring(stiffness = Spring.StiffnessMediumLow),
    initialColor: Color = Color.Black.copy(alpha = 0.5f),
    matchParentSize: Boolean = false,
): EnterTransition
```


This animates an unveiling scrim over the content as it enters.

#### Parameters

| | |
| --- | --- |
| animationSpec | the animation used for the scrim, `spring` by default. |
| initialColor | the starting color of the scrim. |
| matchParentSize | whether the scrim should match the parent size. When `matchParentSize` is true, the veil is applied independently from all other transforms and matches the parent size. When `matchParentSize` is false, the veil is applied first and thus is affected by other transforms. Note: The veil may be clipped if a clip modifier is used on the same layout as the EnterTransition, even when `matchParentSize` is true. |




## Code Examples
### AnimatedContentVeil
```kotlin
@OptIn(ExperimentalAnimationApi::class)
@Composable
fun AnimatedContentVeil() {
    var visible by remember { mutableStateOf(true) }
    Column {
        Button(onClick = { visible = !visible }) { Text("Toggle") }
        AnimatedContent(
            targetState = visible,
            transitionSpec = {
                if (targetState) {
                    (slideInHorizontally { it } togetherWith veilOut()).apply {
                        targetContentZIndex = 1f
                    }
                } else {
                    unveilIn() togetherWith slideOutHorizontally { it }
                }
            },
        ) { isVisible ->
            if (isVisible) {
                Text(modifier = Modifier.fillMaxSize().background(Color.Red), text = "Page 2")
            } else {
                Text(modifier = Modifier.fillMaxSize(), text = "Page 1")
            }
        }
    }
}
```
### AnimatedVisibilityVeil
```kotlin
@OptIn(ExperimentalAnimationApi::class)
@Composable
fun AnimatedVisibilityVeil() {
    var visible by remember { mutableStateOf(true) }
    Column(modifier = Modifier.background(Color.White)) {
        Button(onClick = { visible = !visible }) { Text("Toggle") }
        AnimatedVisibility(
            visible = visible,
            enter = unveilIn(initialColor = Color.White),
            exit = veilOut(targetColor = Color.White),
        ) {
            Box(Modifier.fillMaxSize().padding(30.dp).background(Color.Blue)) { Text("Content") }
        }
    }
}
```

