---
title: FadeInAnimation
framework: applenewsformat
role: symbol
role_heading: Object
path: applenewsformat/fadeinanimation
---

# FadeInAnimation

The animation whereby a component fades into view.

## Declaration

```data
object FadeInAnimation
```

## Properties

type: This animation always has the type fade_in. initialAlpha: The initial transparency of the component (and the animation). Set initialAlpha to a value between 0 (completely transparent) and 1 (completely visible). userControllable: Indicates whether user action like scrolling controls the animation (true), or the animation happens when the component is within the visible area of the document (false).

## Mentioned in

About Component Animations

## Discussion

Discussion With this animation type the component fades in as it enters the person’s view. The initial transparency (alpha value) of the component is configurable. A FadeInAnimation with the userControllable property set to true is shown in this video. Example {   "components": [     {       "role": "heading1",       "text": "2. Unbeatable Heat"     },     {       "role": "figure",       "URL": "bundle://figure.jpg",       "animation": {         "type": "fade_in",         "userControllable": false,         "initialAlpha": 0       }     }   ] }

## Relationships

### Inherits From

- [ComponentAnimation](applenewsformat/componentanimation.md)

## See Also

### Related Documentation

- [Adding Animations](applenews/adding-animations.md)

### Animations

- [About Component Animations](applenews/about-component-animations.md)
- [ComponentAnimation](applenewsformat/componentanimation.md)
- [AppearAnimation](applenewsformat/appearanimation.md)
- [MoveInAnimation](applenewsformat/moveinanimation.md)
- [ScaleFadeAnimation](applenewsformat/scalefadeanimation.md)