> For the complete documentation index, see [llms.txt](https://meulencv.gitbook.io/flutter-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://meulencv.gitbook.io/flutter-documentation/widgets/image/fade-in-image.md).

# Fade In Image

The fade In Image widget is very useful when loading images from the internet, as it gives a more dynamic look to your app by adding a fade in effect to the images.

First, you have to create a folder for the loading image, it's recommended to put `assets` as name.

Later you have to declare it on the `pubspect.yaml`

<pre class="language-yaml"><code class="lang-yaml"><strong> assets: 
</strong><strong>  - assets/
</strong></code></pre>

```dart
FadeInImage(
   placeholder: AssetImage("assets/loading.png"),
   image: NetworkImage(URL),
   // you can add other options
   fit: BoxFit.cover,
   );
```

{% embed url="<https://www.youtube.com/watch?v=GDEM0Wys3lk>" %}