By default, a browser will display links in blue. Bulma has up until now used the $primary color as the $link color:
// Old styles
$link: $primary !default
But the primary color is mostly used as the brand color, and is not necessarily well suited for links. For readability purposes, and to add more flexibility to your design choices:
- the
$linkcolor defaults to$blue $infois using the new$cyancolor$linkhas been added to the$colorsmap as well
// New styles
$link: $blue !default
$info: $cyan !default
As such, the following components are now blue:
All Bulma elements and components that support color modifiers now support the .is-link color:
<div class="notification is-link">
Link notification.
</div>
<div class="notification is-info">
Info notification.
</div>
<button class="button is-link">
Link button
</button>
<button class="button is-info">
Info button
</button>
If you want to use the $primary color for your links, just customize your Bulma setup by including these rules:
$link: $primary !default
$link-invert: $primary-invert !default
$link-focus-border: $primary !default