# Animation Fill Mode

## `fill-mode-*`

<table>
<thead>
<tr>
<th>Class</th>
<th>Styles</th>
</tr>
</thead>
<tbody>
<tr>
<td>

`fill-mode-none`

</td>
<td>

```css
animation-fill-mode: none;
```

</td>
</tr>
<tr>
<td>

`fill-mode-forwards`

</td>
<td>

```css
animation-fill-mode: forwards;
```

</td>
</tr>
<tr>
<td>

`fill-mode-backwards`

</td>
<td>

```css
animation-fill-mode: backwards;
```

</td>
</tr>
<tr>
<td>

`fill-mode-both`

</td>
<td>

```css
animation-fill-mode: both;
```

</td>
</tr>
<tr>
<td>

`fill-mode-initial`

</td>
<td>

```css
animation-fill-mode: initial;
```

</td>
</tr>
<tr>
<td>

`fill-mode-(<custom-property>)`

</td>
<td>

```css
animation-fill-mode: var(<custom-property>);
```

</td>
</tr>
<tr>
<td>

`fill-mode-[<value>]`

</td>
<td>

```css
animation-fill-mode: <value>;
```

</td>
</tr>
</tbody>
</table>

<!-- Links -->

[MDN_Fill_Mode]: https://developer.mozilla.org/en-US/docs/Web/CSS/animation-fill-mode