Colored links

Create colored links with hover and focus states.

Notation #

You can use the .link-{color} classes to colorize links. Unlike the color utilities classes, these classes have a :hover and :focus state. You can see these classes in action in the table below:

.link-primary Aa .link-secondary Aa
.link-success Aa .link-danger Aa
.link-warning Aa .link-info Aa
.link-dark Aa .link-light Aa

You can also modify colored links using link utilities.

<!-- Info link customized with link utilities -->
<a href="#" class="link-success link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">Go to dashboard</a>
Up next
Focus ring

Help us grow

Our main goal is to make Halfmoon the go-to framework for building websites, dashboards and tools. If you believe in our mission, consider becoming a sponsor and help us grow.

You can email us directly if you have any queries. We are always happy to answer.

Subscribe for updates

We will notify you when the framework gets a substantial update. No spam ever.

Follow us on Twitter so that you can stay updated that way.