Dotnav

Create a dot navigation to operate slideshows or to scroll to different page sections.

Table of contents

Usage

To create a navigation with dots, use the following classes. This component is built with Flexbox. So to align a dotnav, you can use utility classes from Tailwind CSS.

ClassDescription
.uk-dotnavAdd this class to a <ul> element to define the Dotnav component. Use <a> elements as nav items within the list.
.uk-active Add this class to a list item to apply an active state.

Vertical alignment

The dotnav can also be displayed vertically. Just add the .uk-dotnav-vertical modifier.

Customize

Customize your Franken UI experience.