# Parallax
Parallax is an effect where the background content or image in this case, is moved at a different speed than the foreground content while scrolling. We build a component who will let you use this beautiful effect very simple:
<parallax class="page-header header-filter header-small" parallax-active="true" :style="headerStyle">
<div class="container">
<div class="md-layout">
<div class="md-layout-item">
// your content here
</div>
</div>
</div>
</parallax>
You have the option to remove this parallax effect by simple changing the attribute
parallax-active="true"
toparallax-active="false"