code compare icon

code-compare from Font Awesome 6 Solid by Dave Gandy · Regular · CC-BY-4.0 Attribution required.

Name: code-compare
Set: Font Awesome 6 Solid
Style: Regular
Viewbox: 512×512
License: CC BY 4.0

The same icon in other sets

Related icons in Font Awesome 6 Solid

code-branch code-commit code-fork code-merge code-pull-request

Use the code compare icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M320 488c0 9.5-5.6 18.1-14.2 21.9s-18.8 2.3-25.8-4.1l-80-72c-5.1-4.6-7.9-11-7.9-17.8s2.9-13.3 7.9-17.8l80-72c7-6.3 17.2-7.9 25.8-4.1S320 334.5 320 344v40h16c35.3 0 64-28.7 64-64V153.3c-28.3-12.3-48-40.5-48-73.3c0-44.2 35.8-80 80-80s80 35.8 80 80c0 32.8-19.7 61-48 73.3V320c0 70.7-57.3 128-128 128h-16zM456 80a24 24 0 1 0-48 0a24 24 0 1 0 48 0M192 24c0-9.5 5.6-18.1 14.2-21.9S225-.2 232 6.2l80 72c5.1 4.6 7.9 11 7.9 17.8s-2.9 13.3-7.9 17.8l-80 72c-7 6.3-17.2 7.9-25.8 4.1S192 177.5 192 168v-40h-16c-35.3 0-64 28.7-64 64v166.7c28.3 12.3 48 40.5 48 73.3c0 44.2-35.8 80-80 80S0 476.2 0 432c0-32.8 19.7-61 48-73.3V192c0-70.7 57.3-128 128-128h16zM56 432a24 24 0 1 0 48 0a24 24 0 1 0-48 0"/></svg>

React

import type { SVGProps } from "react";

export function Fa6SolidCodeCompare(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M320 488c0 9.5-5.6 18.1-14.2 21.9s-18.8 2.3-25.8-4.1l-80-72c-5.1-4.6-7.9-11-7.9-17.8s2.9-13.3 7.9-17.8l80-72c7-6.3 17.2-7.9 25.8-4.1S320 334.5 320 344v40h16c35.3 0 64-28.7 64-64V153.3c-28.3-12.3-48-40.5-48-73.3c0-44.2 35.8-80 80-80s80 35.8 80 80c0 32.8-19.7 61-48 73.3V320c0 70.7-57.3 128-128 128h-16zM456 80a24 24 0 1 0-48 0a24 24 0 1 0 48 0M192 24c0-9.5 5.6-18.1 14.2-21.9S225-.2 232 6.2l80 72c5.1 4.6 7.9 11 7.9 17.8s-2.9 13.3-7.9 17.8l-80 72c-7 6.3-17.2 7.9-25.8 4.1S192 177.5 192 168v-40h-16c-35.3 0-64 28.7-64 64v166.7c28.3 12.3 48 40.5 48 73.3c0 44.2-35.8 80-80 80S0 476.2 0 432c0-32.8 19.7-61 48-73.3V192c0-70.7 57.3-128 128-128h16zM56 432a24 24 0 1 0 48 0a24 24 0 1 0-48 0"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M320 488c0 9.5-5.6 18.1-14.2 21.9s-18.8 2.3-25.8-4.1l-80-72c-5.1-4.6-7.9-11-7.9-17.8s2.9-13.3 7.9-17.8l80-72c7-6.3 17.2-7.9 25.8-4.1S320 334.5 320 344v40h16c35.3 0 64-28.7 64-64V153.3c-28.3-12.3-48-40.5-48-73.3c0-44.2 35.8-80 80-80s80 35.8 80 80c0 32.8-19.7 61-48 73.3V320c0 70.7-57.3 128-128 128h-16zM456 80a24 24 0 1 0-48 0a24 24 0 1 0 48 0M192 24c0-9.5 5.6-18.1 14.2-21.9S225-.2 232 6.2l80 72c5.1 4.6 7.9 11 7.9 17.8s-2.9 13.3-7.9 17.8l-80 72c-7 6.3-17.2 7.9-25.8 4.1S192 177.5 192 168v-40h-16c-35.3 0-64 28.7-64 64v166.7c28.3 12.3 48 40.5 48 73.3c0 44.2-35.8 80-80 80S0 476.2 0 432c0-32.8 19.7-61 48-73.3V192c0-70.7 57.3-128 128-128h16zM56 432a24 24 0 1 0 48 0a24 24 0 1 0-48 0"/></svg>
</template>

CSS

.icon-code-compare {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M320%20488c0%209.5-5.6%2018.1-14.2%2021.9s-18.8%202.3-25.8-4.1l-80-72c-5.1-4.6-7.9-11-7.9-17.8s2.9-13.3%207.9-17.8l80-72c7-6.3%2017.2-7.9%2025.8-4.1S320%20334.5%20320%20344v40h16c35.3%200%2064-28.7%2064-64V153.3c-28.3-12.3-48-40.5-48-73.3c0-44.2%2035.8-80%2080-80s80%2035.8%2080%2080c0%2032.8-19.7%2061-48%2073.3V320c0%2070.7-57.3%20128-128%20128h-16zM456%2080a24%2024%200%201%200-48%200a24%2024%200%201%200%2048%200M192%2024c0-9.5%205.6-18.1%2014.2-21.9S225-.2%20232%206.2l80%2072c5.1%204.6%207.9%2011%207.9%2017.8s-2.9%2013.3-7.9%2017.8l-80%2072c-7%206.3-17.2%207.9-25.8%204.1S192%20177.5%20192%20168v-40h-16c-35.3%200-64%2028.7-64%2064v166.7c28.3%2012.3%2048%2040.5%2048%2073.3c0%2044.2-35.8%2080-80%2080S0%20476.2%200%20432c0-32.8%2019.7-61%2048-73.3V192c0-70.7%2057.3-128%20128-128h16zM56%20432a24%2024%200%201%200%2048%200a24%2024%200%201%200-48%200%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M320%20488c0%209.5-5.6%2018.1-14.2%2021.9s-18.8%202.3-25.8-4.1l-80-72c-5.1-4.6-7.9-11-7.9-17.8s2.9-13.3%207.9-17.8l80-72c7-6.3%2017.2-7.9%2025.8-4.1S320%20334.5%20320%20344v40h16c35.3%200%2064-28.7%2064-64V153.3c-28.3-12.3-48-40.5-48-73.3c0-44.2%2035.8-80%2080-80s80%2035.8%2080%2080c0%2032.8-19.7%2061-48%2073.3V320c0%2070.7-57.3%20128-128%20128h-16zM456%2080a24%2024%200%201%200-48%200a24%2024%200%201%200%2048%200M192%2024c0-9.5%205.6-18.1%2014.2-21.9S225-.2%20232%206.2l80%2072c5.1%204.6%207.9%2011%207.9%2017.8s-2.9%2013.3-7.9%2017.8l-80%2072c-7%206.3-17.2%207.9-25.8%204.1S192%20177.5%20192%20168v-40h-16c-35.3%200-64%2028.7-64%2064v166.7c28.3%2012.3%2048%2040.5%2048%2073.3c0%2044.2-35.8%2080-80%2080S0%20476.2%200%20432c0-32.8%2019.7-61%2048-73.3V192c0-70.7%2057.3-128%20128-128h16zM56%20432a24%2024%200%201%200%2048%200a24%2024%200%201%200-48%200%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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