Service Cards

Use our custom service card components to build any custom section or blocks

Examples

---

Service card 1

View examples code

import { ServiceCard1 } from "@/components/service-cards";
import { FastIcon } from "@/components/icons";
<ServiceCard1
  icon={
    <FastIcon className="h-5 w-5 group-hover:fill-white group-focus:fill-white  transition-all duration-300" />
  }
  title="Streamlined Workflow"
  description="Expand functionality effortlessly with versatile plugins and extensions tailored to enhance your analytics experience."
/>;

Service card 2

View examples code

import { ServiceCard2 } from "@/components/service-cards";
import { FastIcon } from "@/components/icons";
<ServiceCard2
  icon={
    <FastIcon className="size-7 group-hover:fill-white group-focus:fill-white  transition-all duration-300" />
  }
  title="Streamlined Workflow"
  description="Expand functionality effortlessly with versatile plugins and extensions tailored to enhance your analytics experience."
/>;

Service card 2 (with link)

View examples code

import { ServiceCard2 } from "@/components/service-cards";
import { FastIcon } from "@/components/icons";
<ServiceCard2
  icon={
    <FastIcon className="size-7 group-hover:fill-white group-focus:fill-white  transition-all duration-300" />
  }
  title="Streamlined Workflow"
  description="Expand functionality effortlessly with versatile plugins and extensions tailored to enhance your analytics experience."
  href="/service-details"
/>;