.has-text-linkedin
.has-text-linkedin-light
.has-text-linkedin-dark
Styles and examples for .is-linkedin
Button Variants
Available modifiers: default, .is-outlined, .is-light, .is-dark, .is-inverted
<a class="button is-linkedin">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>LinkedIn</span>
</a>
<a class="button is-linkedin is-outlined">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Outlined</span>
</a>
<a class="button is-linkedin is-light">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Light</span>
</a>
<a class="button is-linkedin is-dark">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Dark</span>
</a>
<a class="button is-linkedin is-inverted">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Inverted</span>
</a>Icon Buttons
Buttons without text, icon-only
<a class="button is-linkedin">
<span class="icon">
<i class="fa-brands fa-linkedin fa-lg"></i>
</span>
</a>Button Sizes
Available sizes: .is-small, normal, .is-medium, .is-large
<a class="button is-linkedin is-small">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Small</span>
</a>
<a class="button is-linkedin">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Normal</span>
</a>
<a class="button is-linkedin is-medium">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Medium</span>
</a>
<a class="button is-linkedin is-large">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Large</span>
</a>Button States
Available states: .is-hovered, .is-focused, .is-active, .is-loading, disabled
<a class="button is-linkedin is-hovered">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Hovered</span>
</a>
<a class="button is-linkedin is-focused">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Focused</span>
</a>
<a class="button is-linkedin is-active">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Active</span>
</a>
<a class="button is-linkedin is-loading">
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Loading</span>
</a>
<a class="button is-linkedin" disabled>
<span class="icon">
<i class="fa-brands fa-linkedin"></i>
</span>
<span>Disabled</span>
</a>Text Colors
Helper classes for text color
.has-text-linkedin
.has-text-linkedin-light
.has-text-linkedin-dark
<p class="has-text-linkedin">Text with LinkedIn color</p>
<p class="has-text-linkedin-light">Text with LinkedIn light color</p>
<p class="has-text-linkedin-dark">Text with LinkedIn dark color</p>Background Colors
Helper classes for background color
<div class="has-background-linkedin has-text-white">
.has-background-linkedin
</div>
<div class="has-background-linkedin-light">
.has-background-linkedin-light
</div>
<div class="has-background-linkedin-dark has-text-white">
.has-background-linkedin-dark
</div>