Iconbox
Metronic's Iconbox features icons and text with an animated wave effect.
Get Started
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Get Started
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Tutorials
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Tutorials
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
User Guide
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
User Guide
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Get Started
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-success svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Get Started
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Tutorials
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-danger svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Tutorials
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
User Guide
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-warning svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
User Guide
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Get Started
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate-slow mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-warning svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Get Started
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Tutorials
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate-slower mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-success svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Tutorials
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
User Guide
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate-fast">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-primary svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
User Guide
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Get Started
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate-slow wave-primary mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-success svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Get Started
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
Tutorials
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate wave-danger mb-8 mb-lg-0">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-danger svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
Tutorials
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
User Guide
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy since the 1500s.
<div class="card card-custom wave wave-animate-fast wave-success">
<div class="card-body">
<div class="d-flex align-items-center p-5">
<div class="mr-6">
<span class="svg-icon svg-icon-success svg-icon-4x">
<svg>
...
</svg>
</span>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-dark text-hover-primary font-weight-bold font-size-h4 mb-3">
User Guide
</a>
<div class="text-dark-75">
...
</div>
</div>
</div>
</div>
</div>
