Components Card

Default card

Noteworthy technology acquisitions 2021

Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.

html

typescript

<div flowbiteCard>
  <div flowbiteCardContent>
    <h5 flowbiteCardHeader>Noteworthy technology acquisitions 2021</h5>
    <p>
      Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse
      chronological order.
    </p>
  </div>
</div>

Themes

Card content

{
  "host": {
    "base": "p-6 font-normal",
    "transition": "",
    "color": {
      "default": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      },
      "info": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      },
      "failure": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      },
      "success": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      },
      "warning": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      },
      "primary": {
        "light": "text-gray-700",
        "dark": "dark:text-gray-100"
      }
    },
    "size": {
      "xs": "w-xs",
      "sm": "w-sm",
      "md": "w-md",
      "lg": "w-lg",
      "xl": "w-xl"
    }
  }
}

Card header

{
  "host": {
    "base": "mb-2 text-2xl font-bold tracking-tight",
    "transition": "",
    "color": {
      "default": {
        "light": "text-gray-900",
        "dark": "dark:text-white"
      },
      "info": {
        "light": "text-blue-900",
        "dark": "dark:text-blue-700"
      },
      "failure": {
        "light": "text-red-900",
        "dark": "dark:text-red-700"
      },
      "success": {
        "light": "text-green-900",
        "dark": "dark:text-green-700"
      },
      "warning": {
        "light": "text-yellow-900",
        "dark": "dark:text-yellow-700"
      },
      "primary": {
        "light": "text-primary-900",
        "dark": "dark:text-primary-700"
      }
    }
  }
}

Card

{
  "host": {
    "base": "flex size-fit rounded-lg border shadow-sm",
    "transition": "",
    "orientation": {
      "horizontal": "flex-row",
      "vertical": "flex-col"
    },
    "color": {
      "default": {
        "light": "border-gray-100 bg-white shadow-gray-100",
        "dark": "dark:border-gray-800 dark:bg-gray-900 dark:shadow-gray-800"
      },
      "info": {
        "light": "border-blue-100 bg-white shadow-blue-100",
        "dark": "dark:border-blue-900 dark:bg-gray-900 dark:shadow-blue-900"
      },
      "failure": {
        "light": "border-red-100 bg-white shadow-red-100",
        "dark": "dark:border-red-900 dark:bg-gray-900 dark:shadow-red-900"
      },
      "success": {
        "light": "border-green-100 bg-white shadow-green-100",
        "dark": "dark:border-green-900 dark:bg-gray-900 dark:shadow-green-900"
      },
      "warning": {
        "light": "border-yellow-100 bg-white shadow-yellow-100",
        "dark": "dark:border-yellow-900 dark:bg-gray-900 dark:shadow-yellow-900"
      },
      "primary": {
        "light": "border-primary-100 shadow-primary-100 bg-white",
        "dark": "dark:border-primary-900 dark:shadow-primary-900 dark:bg-gray-900"
      }
    },
    "size": {
      "xs": "w-xs",
      "sm": "w-sm",
      "md": "w-md",
      "lg": "w-lg",
      "xl": "w-xl"
    }
  }
}