facebook logo

facebook from Devicon by konpa · Original · MIT Free for personal and commercial use.

Name
facebook
Set
Devicon
Style
Original
Viewbox
128×128
License
MIT

The same logo in other sets

facebook-fillAkar Iconsfacebook-filledAnt Design IconsfacebookBootstrap IconsfacebookBoxicons BrandsfacebookCoreUI Brandsfacebook-fillEva IconsfacebookFont Awesome 6 BrandsfacebookFont Awesome BrandsfacebookFeather Iconsfacebook-solidFlowbite Iconsfacebookcss.ggfacebookIconParkfacebookIconPark OutlinefacebookIconPark SolidfacebookIconPark TwoTonefacebookIconoirfacebookJam IconsfacebookLine AwesomefacebookMaterial Line IconsfacebookSVG LogosfacebookLucidefacebookMage IconsfacebookMaterial Design Iconsfacebook-fillMingCute Icon

Use the facebook logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><rect width="118.35" height="118.35" x="4.83" y="4.83" fill="#3d5a98" rx="6.53" ry="6.53"/><path fill="#fff" d="M86.48 123.17V77.34h15.38l2.3-17.86H86.48v-11.4c0-5.17 1.44-8.7 8.85-8.7h9.46v-16A127 127 0 0 0 91 22.7c-13.62 0-23 8.3-23 23.61v13.17H52.62v17.86H68v45.83z"/></svg>

React

import type { SVGProps } from "react";

export function DeviconFacebook(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><rect width="118.35" height="118.35" x="4.83" y="4.83" fill="#3d5a98" rx="6.53" ry="6.53"/><path fill="#fff" d="M86.48 123.17V77.34h15.38l2.3-17.86H86.48v-11.4c0-5.17 1.44-8.7 8.85-8.7h9.46v-16A127 127 0 0 0 91 22.7c-13.62 0-23 8.3-23 23.61v13.17H52.62v17.86H68v45.83z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><rect width="118.35" height="118.35" x="4.83" y="4.83" fill="#3d5a98" rx="6.53" ry="6.53"/><path fill="#fff" d="M86.48 123.17V77.34h15.38l2.3-17.86H86.48v-11.4c0-5.17 1.44-8.7 8.85-8.7h9.46v-16A127 127 0 0 0 91 22.7c-13.62 0-23 8.3-23 23.61v13.17H52.62v17.86H68v45.83z"/></svg>
</template>

CSS

.icon-facebook {
  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%20128%20128%22%3E%3Crect%20width%3D%22118.35%22%20height%3D%22118.35%22%20x%3D%224.83%22%20y%3D%224.83%22%20fill%3D%22%233d5a98%22%20rx%3D%226.53%22%20ry%3D%226.53%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M86.48%20123.17V77.34h15.38l2.3-17.86H86.48v-11.4c0-5.17%201.44-8.7%208.85-8.7h9.46v-16A127%20127%200%200%200%2091%2022.7c-13.62%200-23%208.3-23%2023.61v13.17H52.62v17.86H68v45.83z%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%20128%20128%22%3E%3Crect%20width%3D%22118.35%22%20height%3D%22118.35%22%20x%3D%224.83%22%20y%3D%224.83%22%20fill%3D%22%233d5a98%22%20rx%3D%226.53%22%20ry%3D%226.53%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M86.48%20123.17V77.34h15.38l2.3-17.86H86.48v-11.4c0-5.17%201.44-8.7%208.85-8.7h9.46v-16A127%20127%200%200%200%2091%2022.7c-13.62%200-23%208.3-23%2023.61v13.17H52.62v17.86H68v45.83z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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

Facebook logo — Devicon · IconsDB