myshell logo
myshell-color from LobeHub AI Icons by LobeHub · Color · MIT Free for personal and commercial use.
- Name
- myshell-color
- Set
- LobeHub AI Icons
- Style
- Color
- Viewbox
- 24×24
- License
- MIT
2 other variants in LobeHub AI Icons
Use the myshell logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="url(#svgID)" d="M5.743 4C1.703 4 .306 13.31.002 15.83c-.026.216.241.328.404.182 7.957-7.15 11.644 3.594 14.802 3.594-1.768 0-3.063-4.94-4.69-9.263C9.253 6.985 7.788 4 5.743 4z"/><path fill="url(#svgID1)" d="M23.58 15.76c.153.185.454.063.417-.174-.364-2.303-1.562-8.395-4.078-8.395-1.547 0-1.941 3.084-2.337 6.178l-.002.01c3.381 0 4.665.758 6 2.38z"/><path fill="#ddb1ff" d="M10.517 10.343c1.627 4.322 2.923 9.263 4.69 9.263 1.573 0 1.975-3.117 2.373-6.226l.002-.01c.396-3.095.79-6.18 2.336-6.18-3.1 0-4.71 11.248-9.4 3.153z"/><defs><linearGradient id="svgID" x1="0" x2="15.209" y1="11.563" y2="12.019" gradientUnits="userSpaceOnUse"><stop stop-color="#3239dc"/><stop offset="1" stop-color="#5a38e2"/></linearGradient><linearGradient id="svgID1" x1="17.58" x2="24.003" y1="11.387" y2="11.533" gradientUnits="userSpaceOnUse"><stop stop-color="#3239dc"/><stop offset="1" stop-color="#5a38e2"/></linearGradient></defs></svg>
React
import type { SVGProps } from "react";
export function LobehubMyshellColor(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="url(#svgID)" d="M5.743 4C1.703 4 .306 13.31.002 15.83c-.026.216.241.328.404.182 7.957-7.15 11.644 3.594 14.802 3.594-1.768 0-3.063-4.94-4.69-9.263C9.253 6.985 7.788 4 5.743 4z"/><path fill="url(#svgID1)" d="M23.58 15.76c.153.185.454.063.417-.174-.364-2.303-1.562-8.395-4.078-8.395-1.547 0-1.941 3.084-2.337 6.178l-.002.01c3.381 0 4.665.758 6 2.38z"/><path fill="#ddb1ff" d="M10.517 10.343c1.627 4.322 2.923 9.263 4.69 9.263 1.573 0 1.975-3.117 2.373-6.226l.002-.01c.396-3.095.79-6.18 2.336-6.18-3.1 0-4.71 11.248-9.4 3.153z"/><defs><linearGradient id="svgID" x1="0" x2="15.209" y1="11.563" y2="12.019" gradientUnits="userSpaceOnUse"><stop stopColor="#3239dc"/><stop offset="1" stopColor="#5a38e2"/></linearGradient><linearGradient id="svgID1" x1="17.58" x2="24.003" y1="11.387" y2="11.533" gradientUnits="userSpaceOnUse"><stop stopColor="#3239dc"/><stop offset="1" stopColor="#5a38e2"/></linearGradient></defs></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="url(#svgID)" d="M5.743 4C1.703 4 .306 13.31.002 15.83c-.026.216.241.328.404.182 7.957-7.15 11.644 3.594 14.802 3.594-1.768 0-3.063-4.94-4.69-9.263C9.253 6.985 7.788 4 5.743 4z"/><path fill="url(#svgID1)" d="M23.58 15.76c.153.185.454.063.417-.174-.364-2.303-1.562-8.395-4.078-8.395-1.547 0-1.941 3.084-2.337 6.178l-.002.01c3.381 0 4.665.758 6 2.38z"/><path fill="#ddb1ff" d="M10.517 10.343c1.627 4.322 2.923 9.263 4.69 9.263 1.573 0 1.975-3.117 2.373-6.226l.002-.01c.396-3.095.79-6.18 2.336-6.18-3.1 0-4.71 11.248-9.4 3.153z"/><defs><linearGradient id="svgID" x1="0" x2="15.209" y1="11.563" y2="12.019" gradientUnits="userSpaceOnUse"><stop stop-color="#3239dc"/><stop offset="1" stop-color="#5a38e2"/></linearGradient><linearGradient id="svgID1" x1="17.58" x2="24.003" y1="11.387" y2="11.533" gradientUnits="userSpaceOnUse"><stop stop-color="#3239dc"/><stop offset="1" stop-color="#5a38e2"/></linearGradient></defs></svg> </template>
CSS
.icon-myshell-color {
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%22url(%23svgID)%22%20d%3D%22M5.743%204C1.703%204%20.306%2013.31.002%2015.83c-.026.216.241.328.404.182%207.957-7.15%2011.644%203.594%2014.802%203.594-1.768%200-3.063-4.94-4.69-9.263C9.253%206.985%207.788%204%205.743%204z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID1)%22%20d%3D%22M23.58%2015.76c.153.185.454.063.417-.174-.364-2.303-1.562-8.395-4.078-8.395-1.547%200-1.941%203.084-2.337%206.178l-.002.01c3.381%200%204.665.758%206%202.38z%22%2F%3E%3Cpath%20fill%3D%22%23ddb1ff%22%20d%3D%22M10.517%2010.343c1.627%204.322%202.923%209.263%204.69%209.263%201.573%200%201.975-3.117%202.373-6.226l.002-.01c.396-3.095.79-6.18%202.336-6.18-3.1%200-4.71%2011.248-9.4%203.153z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22svgID%22%20x1%3D%220%22%20x2%3D%2215.209%22%20y1%3D%2211.563%22%20y2%3D%2212.019%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%233239dc%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%235a38e2%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID1%22%20x1%3D%2217.58%22%20x2%3D%2224.003%22%20y1%3D%2211.387%22%20y2%3D%2211.533%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%233239dc%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%235a38e2%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%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%22url(%23svgID)%22%20d%3D%22M5.743%204C1.703%204%20.306%2013.31.002%2015.83c-.026.216.241.328.404.182%207.957-7.15%2011.644%203.594%2014.802%203.594-1.768%200-3.063-4.94-4.69-9.263C9.253%206.985%207.788%204%205.743%204z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID1)%22%20d%3D%22M23.58%2015.76c.153.185.454.063.417-.174-.364-2.303-1.562-8.395-4.078-8.395-1.547%200-1.941%203.084-2.337%206.178l-.002.01c3.381%200%204.665.758%206%202.38z%22%2F%3E%3Cpath%20fill%3D%22%23ddb1ff%22%20d%3D%22M10.517%2010.343c1.627%204.322%202.923%209.263%204.69%209.263%201.573%200%201.975-3.117%202.373-6.226l.002-.01c.396-3.095.79-6.18%202.336-6.18-3.1%200-4.71%2011.248-9.4%203.153z%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22svgID%22%20x1%3D%220%22%20x2%3D%2215.209%22%20y1%3D%2211.563%22%20y2%3D%2212.019%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%233239dc%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%235a38e2%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID1%22%20x1%3D%2217.58%22%20x2%3D%2224.003%22%20y1%3D%2211.387%22%20y2%3D%2211.533%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%233239dc%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%235a38e2%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/lobehub/myshell-color.svg?color=%231a73e8&size=48
