macports logo

macports from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.

Name
macports
Set
Simple Icons
Style
Brand
Viewbox
24×24
License
CC0 1.0

Use the macports logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.055 4.154c-1.323 0-2.395 1.16-2.395 2.593v10.506c0 1.432 1.072 2.593 2.395 2.593h7.55c1.323 0 2.395-1.161 2.395-2.593V6.747c0-1.432-1.072-2.593-2.395-2.593zm3.604 3.004c1.34 0 2.296.256 2.938.77c.628.485 1.027 1.283 1.027 2.225c0 .941-.3 1.754-.884 2.282c-.742.685-1.84 1.013-3.124 1.013c-.285 0-.542-.015-.741-.057v3.451H14.72V7.357c.67-.114 1.612-.2 2.938-.2zM.614 7.193L0 16.807h2.011l.186-3.652c.057-1.198.114-2.681.156-3.979h.029c.243 1.255.557 2.624.87 3.765L4.28 16.65h1.697l1.17-3.751A61 61 0 0 0 8.23 9.176h.029c0 1.398.042 2.796.085 3.95l.157 3.68h2.11L10.1 7.194H7.246l-1.013 3.195a53 53 0 0 0-.913 3.452h-.057a41 41 0 0 0-.813-3.438l-.94-3.21zm17.145 1.62c-.428 0-.727.028-.884.07v2.839c.185.043.399.057.727.057c1.155 0 1.868-.585 1.868-1.555c0-.884-.613-1.412-1.711-1.412z"/></svg>

React

import type { SVGProps } from "react";

export function SimpleIconsMacports(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.055 4.154c-1.323 0-2.395 1.16-2.395 2.593v10.506c0 1.432 1.072 2.593 2.395 2.593h7.55c1.323 0 2.395-1.161 2.395-2.593V6.747c0-1.432-1.072-2.593-2.395-2.593zm3.604 3.004c1.34 0 2.296.256 2.938.77c.628.485 1.027 1.283 1.027 2.225c0 .941-.3 1.754-.884 2.282c-.742.685-1.84 1.013-3.124 1.013c-.285 0-.542-.015-.741-.057v3.451H14.72V7.357c.67-.114 1.612-.2 2.938-.2zM.614 7.193L0 16.807h2.011l.186-3.652c.057-1.198.114-2.681.156-3.979h.029c.243 1.255.557 2.624.87 3.765L4.28 16.65h1.697l1.17-3.751A61 61 0 0 0 8.23 9.176h.029c0 1.398.042 2.796.085 3.95l.157 3.68h2.11L10.1 7.194H7.246l-1.013 3.195a53 53 0 0 0-.913 3.452h-.057a41 41 0 0 0-.813-3.438l-.94-3.21zm17.145 1.62c-.428 0-.727.028-.884.07v2.839c.185.043.399.057.727.057c1.155 0 1.868-.585 1.868-1.555c0-.884-.613-1.412-1.711-1.412z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.055 4.154c-1.323 0-2.395 1.16-2.395 2.593v10.506c0 1.432 1.072 2.593 2.395 2.593h7.55c1.323 0 2.395-1.161 2.395-2.593V6.747c0-1.432-1.072-2.593-2.395-2.593zm3.604 3.004c1.34 0 2.296.256 2.938.77c.628.485 1.027 1.283 1.027 2.225c0 .941-.3 1.754-.884 2.282c-.742.685-1.84 1.013-3.124 1.013c-.285 0-.542-.015-.741-.057v3.451H14.72V7.357c.67-.114 1.612-.2 2.938-.2zM.614 7.193L0 16.807h2.011l.186-3.652c.057-1.198.114-2.681.156-3.979h.029c.243 1.255.557 2.624.87 3.765L4.28 16.65h1.697l1.17-3.751A61 61 0 0 0 8.23 9.176h.029c0 1.398.042 2.796.085 3.95l.157 3.68h2.11L10.1 7.194H7.246l-1.013 3.195a53 53 0 0 0-.913 3.452h-.057a41 41 0 0 0-.813-3.438l-.94-3.21zm17.145 1.62c-.428 0-.727.028-.884.07v2.839c.185.043.399.057.727.057c1.155 0 1.868-.585 1.868-1.555c0-.884-.613-1.412-1.711-1.412z"/></svg>
</template>

CSS

.icon-macports {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.055%204.154c-1.323%200-2.395%201.16-2.395%202.593v10.506c0%201.432%201.072%202.593%202.395%202.593h7.55c1.323%200%202.395-1.161%202.395-2.593V6.747c0-1.432-1.072-2.593-2.395-2.593zm3.604%203.004c1.34%200%202.296.256%202.938.77c.628.485%201.027%201.283%201.027%202.225c0%20.941-.3%201.754-.884%202.282c-.742.685-1.84%201.013-3.124%201.013c-.285%200-.542-.015-.741-.057v3.451H14.72V7.357c.67-.114%201.612-.2%202.938-.2zM.614%207.193L0%2016.807h2.011l.186-3.652c.057-1.198.114-2.681.156-3.979h.029c.243%201.255.557%202.624.87%203.765L4.28%2016.65h1.697l1.17-3.751A61%2061%200%200%200%208.23%209.176h.029c0%201.398.042%202.796.085%203.95l.157%203.68h2.11L10.1%207.194H7.246l-1.013%203.195a53%2053%200%200%200-.913%203.452h-.057a41%2041%200%200%200-.813-3.438l-.94-3.21zm17.145%201.62c-.428%200-.727.028-.884.07v2.839c.185.043.399.057.727.057c1.155%200%201.868-.585%201.868-1.555c0-.884-.613-1.412-1.711-1.412z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.055%204.154c-1.323%200-2.395%201.16-2.395%202.593v10.506c0%201.432%201.072%202.593%202.395%202.593h7.55c1.323%200%202.395-1.161%202.395-2.593V6.747c0-1.432-1.072-2.593-2.395-2.593zm3.604%203.004c1.34%200%202.296.256%202.938.77c.628.485%201.027%201.283%201.027%202.225c0%20.941-.3%201.754-.884%202.282c-.742.685-1.84%201.013-3.124%201.013c-.285%200-.542-.015-.741-.057v3.451H14.72V7.357c.67-.114%201.612-.2%202.938-.2zM.614%207.193L0%2016.807h2.011l.186-3.652c.057-1.198.114-2.681.156-3.979h.029c.243%201.255.557%202.624.87%203.765L4.28%2016.65h1.697l1.17-3.751A61%2061%200%200%200%208.23%209.176h.029c0%201.398.042%202.796.085%203.95l.157%203.68h2.11L10.1%207.194H7.246l-1.013%203.195a53%2053%200%200%200-.913%203.452h-.057a41%2041%200%200%200-.813-3.438l-.94-3.21zm17.145%201.62c-.428%200-.727.028-.884.07v2.839c.185.043.399.057.727.057c1.155%200%201.868-.585%201.868-1.555c0-.884-.613-1.412-1.711-1.412z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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