kaaba icon

kaaba from Font Awesome Solid by Dave Gandy · Solid · Buildings · CC-BY-4.0 Attribution required.

Name
kaaba
Set
Font Awesome Solid
Style
Solid
Category
Buildings
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

kaabaEmoji One (Colored)kaabaFont Awesome 6 SolidkaabaFluent EmojikaabaFluent Emoji FlatkaabaFluent Emoji High ContrastkaabaLine AwesomekaabaNoto EmojikaabaOpenMojikaabaTwitter Emoji

More buildings icons from Font Awesome Solid

archwaybuildingchurchcityclinic-medicaldungeongopuramhomehospitalhospital-althospital-userhotelhouse-damageiglooindustrylandmarkmonumentmosqueplace-of-worshipschoolstorestore-altsynagoguetorii-gate

Use the kaaba icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="m320 115.3l-163.2 61.1l154.7 58.7c5.5 2.1 11.5 2.1 17 0l154.7-58.7zm-256 78c0-20 12.4-37.9 31.1-44.9l208-78c10.9-4.1 22.8-4.1 33.7 0l208 78c18.7 7 31.1 24.9 31.1 44.9v36l-253.2 96c-1.8.7-3.8.7-5.7 0l-253.2-96v-36zm0 140v-52.7l236.1 89.6c12.8 4.9 26.9 4.9 39.7 0l236.1-89.6v52.7l-128 48.6v51.3l128-48.6v62.2c0 20-12.4 37.9-31.1 44.9l-208 78c-10.9 4.1-22.8 4.1-33.7 0l-208-78c-18.7-7-31.1-25-31.1-45v-62.2l128 48.6v-51.3L64 333.2zm236.1 140.8c12.8 4.9 26.9 4.9 39.7 0l60.1-22.8V400l-77.2 29.3c-1.8.7-3.8.7-5.7 0L239.8 400v51.3l60.1 22.8z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidKaaba(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="m320 115.3l-163.2 61.1l154.7 58.7c5.5 2.1 11.5 2.1 17 0l154.7-58.7zm-256 78c0-20 12.4-37.9 31.1-44.9l208-78c10.9-4.1 22.8-4.1 33.7 0l208 78c18.7 7 31.1 24.9 31.1 44.9v36l-253.2 96c-1.8.7-3.8.7-5.7 0l-253.2-96v-36zm0 140v-52.7l236.1 89.6c12.8 4.9 26.9 4.9 39.7 0l236.1-89.6v52.7l-128 48.6v51.3l128-48.6v62.2c0 20-12.4 37.9-31.1 44.9l-208 78c-10.9 4.1-22.8 4.1-33.7 0l-208-78c-18.7-7-31.1-25-31.1-45v-62.2l128 48.6v-51.3L64 333.2zm236.1 140.8c12.8 4.9 26.9 4.9 39.7 0l60.1-22.8V400l-77.2 29.3c-1.8.7-3.8.7-5.7 0L239.8 400v51.3l60.1 22.8z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="m320 115.3l-163.2 61.1l154.7 58.7c5.5 2.1 11.5 2.1 17 0l154.7-58.7zm-256 78c0-20 12.4-37.9 31.1-44.9l208-78c10.9-4.1 22.8-4.1 33.7 0l208 78c18.7 7 31.1 24.9 31.1 44.9v36l-253.2 96c-1.8.7-3.8.7-5.7 0l-253.2-96v-36zm0 140v-52.7l236.1 89.6c12.8 4.9 26.9 4.9 39.7 0l236.1-89.6v52.7l-128 48.6v51.3l128-48.6v62.2c0 20-12.4 37.9-31.1 44.9l-208 78c-10.9 4.1-22.8 4.1-33.7 0l-208-78c-18.7-7-31.1-25-31.1-45v-62.2l128 48.6v-51.3L64 333.2zm236.1 140.8c12.8 4.9 26.9 4.9 39.7 0l60.1-22.8V400l-77.2 29.3c-1.8.7-3.8.7-5.7 0L239.8 400v51.3l60.1 22.8z"/></svg>
</template>

CSS

.icon-kaaba {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m320%20115.3l-163.2%2061.1l154.7%2058.7c5.5%202.1%2011.5%202.1%2017%200l154.7-58.7zm-256%2078c0-20%2012.4-37.9%2031.1-44.9l208-78c10.9-4.1%2022.8-4.1%2033.7%200l208%2078c18.7%207%2031.1%2024.9%2031.1%2044.9v36l-253.2%2096c-1.8.7-3.8.7-5.7%200l-253.2-96v-36zm0%20140v-52.7l236.1%2089.6c12.8%204.9%2026.9%204.9%2039.7%200l236.1-89.6v52.7l-128%2048.6v51.3l128-48.6v62.2c0%2020-12.4%2037.9-31.1%2044.9l-208%2078c-10.9%204.1-22.8%204.1-33.7%200l-208-78c-18.7-7-31.1-25-31.1-45v-62.2l128%2048.6v-51.3L64%20333.2zm236.1%20140.8c12.8%204.9%2026.9%204.9%2039.7%200l60.1-22.8V400l-77.2%2029.3c-1.8.7-3.8.7-5.7%200L239.8%20400v51.3l60.1%2022.8z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m320%20115.3l-163.2%2061.1l154.7%2058.7c5.5%202.1%2011.5%202.1%2017%200l154.7-58.7zm-256%2078c0-20%2012.4-37.9%2031.1-44.9l208-78c10.9-4.1%2022.8-4.1%2033.7%200l208%2078c18.7%207%2031.1%2024.9%2031.1%2044.9v36l-253.2%2096c-1.8.7-3.8.7-5.7%200l-253.2-96v-36zm0%20140v-52.7l236.1%2089.6c12.8%204.9%2026.9%204.9%2039.7%200l236.1-89.6v52.7l-128%2048.6v51.3l128-48.6v62.2c0%2020-12.4%2037.9-31.1%2044.9l-208%2078c-10.9%204.1-22.8%204.1-33.7%200l-208-78c-18.7-7-31.1-25-31.1-45v-62.2l128%2048.6v-51.3L64%20333.2zm236.1%20140.8c12.8%204.9%2026.9%204.9%2039.7%200l60.1-22.8V400l-77.2%2029.3c-1.8.7-3.8.7-5.7%200L239.8%20400v51.3l60.1%2022.8z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/kaaba.svg?color=%231a73e8&size=48