mqtt logo
mqtt from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- mqtt
- Set
- Simple Icons
- Style
- Brand
- Viewbox
- 24×24
- License
- CC0 1.0
The same logo in other sets
Use the mqtt logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M10.657 23.994h-9.45A1.21 1.21 0 0 1 0 22.788v-9.18h.071c5.784 0 10.504 4.65 10.586 10.386m7.606 0h-4.045C14.135 16.246 7.795 9.977 0 9.942V6.038h.071c9.983 0 18.121 8.044 18.192 17.956m4.53 0h-.97C21.754 12.071 11.995 2.407 0 2.372v-1.16C0 .55.544.006 1.207.006h7.64C15.733 2.49 21.257 7.789 24 14.508v8.291c0 .663-.544 1.195-1.207 1.195M16.713.006h6.092A1.19 1.19 0 0 1 24 1.2v5.914c-.91-1.242-2.046-2.65-3.158-3.762C19.588 2.11 18.122.987 16.714.005Z"/></svg>
React
import type { SVGProps } from "react";
export function SimpleIconsMqtt(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="M10.657 23.994h-9.45A1.21 1.21 0 0 1 0 22.788v-9.18h.071c5.784 0 10.504 4.65 10.586 10.386m7.606 0h-4.045C14.135 16.246 7.795 9.977 0 9.942V6.038h.071c9.983 0 18.121 8.044 18.192 17.956m4.53 0h-.97C21.754 12.071 11.995 2.407 0 2.372v-1.16C0 .55.544.006 1.207.006h7.64C15.733 2.49 21.257 7.789 24 14.508v8.291c0 .663-.544 1.195-1.207 1.195M16.713.006h6.092A1.19 1.19 0 0 1 24 1.2v5.914c-.91-1.242-2.046-2.65-3.158-3.762C19.588 2.11 18.122.987 16.714.005Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M10.657 23.994h-9.45A1.21 1.21 0 0 1 0 22.788v-9.18h.071c5.784 0 10.504 4.65 10.586 10.386m7.606 0h-4.045C14.135 16.246 7.795 9.977 0 9.942V6.038h.071c9.983 0 18.121 8.044 18.192 17.956m4.53 0h-.97C21.754 12.071 11.995 2.407 0 2.372v-1.16C0 .55.544.006 1.207.006h7.64C15.733 2.49 21.257 7.789 24 14.508v8.291c0 .663-.544 1.195-1.207 1.195M16.713.006h6.092A1.19 1.19 0 0 1 24 1.2v5.914c-.91-1.242-2.046-2.65-3.158-3.762C19.588 2.11 18.122.987 16.714.005Z"/></svg> </template>
CSS
.icon-mqtt {
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%22M10.657%2023.994h-9.45A1.21%201.21%200%200%201%200%2022.788v-9.18h.071c5.784%200%2010.504%204.65%2010.586%2010.386m7.606%200h-4.045C14.135%2016.246%207.795%209.977%200%209.942V6.038h.071c9.983%200%2018.121%208.044%2018.192%2017.956m4.53%200h-.97C21.754%2012.071%2011.995%202.407%200%202.372v-1.16C0%20.55.544.006%201.207.006h7.64C15.733%202.49%2021.257%207.789%2024%2014.508v8.291c0%20.663-.544%201.195-1.207%201.195M16.713.006h6.092A1.19%201.19%200%200%201%2024%201.2v5.914c-.91-1.242-2.046-2.65-3.158-3.762C19.588%202.11%2018.122.987%2016.714.005Z%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%22M10.657%2023.994h-9.45A1.21%201.21%200%200%201%200%2022.788v-9.18h.071c5.784%200%2010.504%204.65%2010.586%2010.386m7.606%200h-4.045C14.135%2016.246%207.795%209.977%200%209.942V6.038h.071c9.983%200%2018.121%208.044%2018.192%2017.956m4.53%200h-.97C21.754%2012.071%2011.995%202.407%200%202.372v-1.16C0%20.55.544.006%201.207.006h7.64C15.733%202.49%2021.257%207.789%2024%2014.508v8.291c0%20.663-.544%201.195-1.207%201.195M16.713.006h6.092A1.19%201.19%200%200%201%2024%201.2v5.914c-.91-1.242-2.046-2.65-3.158-3.762C19.588%202.11%2018.122.987%2016.714.005Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/mqtt.svg?color=%231a73e8&size=48
