Fullscreen Hero Slideshow

Squared Centered Slides

<div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1" uk-slider="center: true">
<ul class="uk-slider-items uk-grid uk-margin-auto uk-text-center">
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/500x500/123/321?text=Background" width="500" height="500" alt="">
<div class="uk-position-center uk-panel"><h2>1</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/500x500/234/321?text=Background" width="500" height="500" alt="">
<div class="uk-position-center uk-panel"><h2>2</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/500x500/345/321?text=Background" width="500" height="500" alt="">
<div class="uk-position-center uk-panel"><h2>3</h2></div>
</div>
</li>
</ul>
<a class="uk-position-center-left uk-position-small uk-hidden-hover" href uk-slidenav-previous uk-slider-item="previous"></a>
<a class="uk-position-center-right uk-position-small uk-hidden-hover" href uk-slidenav-next uk-slider-item="next"></a>
</div>

Wide Horizontal Slides

<div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1" uk-slider="center: true">
<ul class="uk-slider-items uk-grid">
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/1400x800/123/321?text=Background" width="1400" height="800" alt="">
<div class="uk-position-center uk-panel"><h2>1</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/1400x800/234/321?text=Background" width="1400" height="800" alt="">
<div class="uk-position-center uk-panel"><h2>2</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/1400x800/345/321?text=Background" width="1400" height="800" alt="">
<div class="uk-position-center uk-panel"><h2>3</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/1400x800/456/321?text=Background" width="1400" height="800" alt="">
<div class="uk-position-center uk-panel"><h2>4</h2></div>
</div>
</li>
<li class="uk-width-3-4">
<div class="uk-panel">
<img src="https://placehold.co/1400x800/567/321?text=Background" width="1400" height="800" alt="">
<div class="uk-position-center uk-panel"><h2>5</h2></div>
</div>
</li>
</ul>
<a class="uk-position-center-left uk-position-small uk-hidden-hover" href uk-slidenav-previous uk-slider-item="previous"></a>
<a class="uk-position-center-right uk-position-small uk-hidden-hover" href uk-slidenav-next uk-slider-item="next"></a>
</div>