phtml logo

phtml from Catppuccin Icons by Catppuccin · Color · MIT Free for personal and commercial use.

Name
phtml
Set
Catppuccin Icons
Style
Color
Viewbox
16×18
License
MIT

Use the phtml logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 18"><g fill="none" stroke="#8aadf4"><path d="M1 2.7c0-.7.5-1.4 1.2-1.4h11.6c.7 0 1.3.7 1.2 1.4l-1.3 10.4c0 .4-.3.8-.6 1l-4.5 2.4q-.6.45-1.2 0l-4.5-2.4c-.3-.2-.5-.6-.6-1z"/><path stroke-linecap="round" d="m4 9l.2-1.4m0 0S4.4 6 4.7 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8zM7.3 9l.4-1.5M8 6l-.3 1.5m0 0s.5-.5.8-.5c.4 0 .8 0 .8.3L9 9m1.6 0l.2-1.4m0 0S11 6 11.3 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8z"/></g></svg>

React

import type { SVGProps } from "react";

export function CatppuccinPhtml(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 18"><g fill="none" stroke="#8aadf4"><path d="M1 2.7c0-.7.5-1.4 1.2-1.4h11.6c.7 0 1.3.7 1.2 1.4l-1.3 10.4c0 .4-.3.8-.6 1l-4.5 2.4q-.6.45-1.2 0l-4.5-2.4c-.3-.2-.5-.6-.6-1z"/><path strokeLinecap="round" d="m4 9l.2-1.4m0 0S4.4 6 4.7 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8zM7.3 9l.4-1.5M8 6l-.3 1.5m0 0s.5-.5.8-.5c.4 0 .8 0 .8.3L9 9m1.6 0l.2-1.4m0 0S11 6 11.3 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 18"><g fill="none" stroke="#8aadf4"><path d="M1 2.7c0-.7.5-1.4 1.2-1.4h11.6c.7 0 1.3.7 1.2 1.4l-1.3 10.4c0 .4-.3.8-.6 1l-4.5 2.4q-.6.45-1.2 0l-4.5-2.4c-.3-.2-.5-.6-.6-1z"/><path stroke-linecap="round" d="m4 9l.2-1.4m0 0S4.4 6 4.7 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8zM7.3 9l.4-1.5M8 6l-.3 1.5m0 0s.5-.5.8-.5c.4 0 .8 0 .8.3L9 9m1.6 0l.2-1.4m0 0S11 6 11.3 6h.6c.3 0 .7.3.7.8c0 .6-.4.8-.7.8z"/></g></svg>
</template>

CSS

.icon-phtml {
  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%2016%2018%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%238aadf4%22%3E%3Cpath%20d%3D%22M1%202.7c0-.7.5-1.4%201.2-1.4h11.6c.7%200%201.3.7%201.2%201.4l-1.3%2010.4c0%20.4-.3.8-.6%201l-4.5%202.4q-.6.45-1.2%200l-4.5-2.4c-.3-.2-.5-.6-.6-1z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22m4%209l.2-1.4m0%200S4.4%206%204.7%206h.6c.3%200%20.7.3.7.8c0%20.6-.4.8-.7.8zM7.3%209l.4-1.5M8%206l-.3%201.5m0%200s.5-.5.8-.5c.4%200%20.8%200%20.8.3L9%209m1.6%200l.2-1.4m0%200S11%206%2011.3%206h.6c.3%200%20.7.3.7.8c0%20.6-.4.8-.7.8z%22%2F%3E%3C%2Fg%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%2016%2018%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%238aadf4%22%3E%3Cpath%20d%3D%22M1%202.7c0-.7.5-1.4%201.2-1.4h11.6c.7%200%201.3.7%201.2%201.4l-1.3%2010.4c0%20.4-.3.8-.6%201l-4.5%202.4q-.6.45-1.2%200l-4.5-2.4c-.3-.2-.5-.6-.6-1z%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22m4%209l.2-1.4m0%200S4.4%206%204.7%206h.6c.3%200%20.7.3.7.8c0%20.6-.4.8-.7.8zM7.3%209l.4-1.5M8%206l-.3%201.5m0%200s.5-.5.8-.5c.4%200%20.8%200%20.8.3L9%209m1.6%200l.2-1.4m0%200S11%206%2011.3%206h.6c.3%200%20.7.3.7.8c0%20.6-.4.8-.7.8z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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