poolside logo
poolside from LobeHub AI Icons by LobeHub · Mono · MIT Free for personal and commercial use.
- Name
- poolside
- Set
- LobeHub AI Icons
- Style
- Mono
- Viewbox
- 24×24
- License
- MIT
2 other variants in LobeHub AI Icons
Use the poolside logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor" fill-rule="evenodd"><g clip-path="url(#svgID12)"><mask id="svgID8" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="url(#svgID9)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID10)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID11)" d="M24 0H0v24h24V0z"/></mask><g mask="url(#svgID8)"><path d="M6.742 22.786a11.93 11.93 0 01-5.232-4.963 11.98 11.98 0 01-1.463-6.886.975.975 0 011.943.173c-.178 2.005.246 4 1.226 5.769a9.968 9.968 0 003.526 3.685l4.586-9.405c-1.795-.598-3.29-.338-3.425-.312l-.058.012a.972.972 0 01-1.054-.576c-.24-.448-.96-1.544-1.834-1.97-.873-.426-2.218-.289-2.651-.195a.977.977 0 01-1.087-1.38C4.117.792 11.315-1.686 17.262 1.215c5.946 2.9 8.422 10.093 5.529 16.038l-.01.02c-2.903 5.94-10.095 8.414-16.039 5.514zm6.338-10.773l-4.586 9.405c4.629 1.73 9.896-.192 12.304-4.558-.338-.524-.932-1.275-1.62-1.61-.888-.434-2.19-.292-2.637-.198a.989.989 0 01-.616-.055.984.984 0 01-.49-.473c-.028-.058-.739-1.438-2.355-2.51zM5.81 6.56c.747.365 1.356.944 1.81 1.49 1.406-2.15 3.314-3.774 4.787-4.82a20.81 20.81 0 011.66-1.067A10.078 10.078 0 003.882 6.077c.617.042 1.297.174 1.929.482zm12.671-2.243c.09.624.152 1.294.182 1.965.083 1.801-.021 4.296-.844 6.722.686.018 1.484.14 2.214.495.652.318 1.198.8 1.628 1.28a10.082 10.082 0 00-3.18-10.462zm-5.394 5.46a9.522 9.522 0 012.984 2.287c1.075-3.493.606-7.402.215-8.85-1.381.584-4.75 2.62-6.84 5.618a9.515 9.515 0 013.64.944z"/></g></g><defs><linearGradient id="svgID9" x1="6.75" x2="5.625" y1="20.55" y2="20.55" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor"/><stop offset="1" stop-color="currentColor" stop-opacity="0"/></linearGradient><linearGradient id="svgID10" x1="6.825" x2="7.2" y1="11.85" y2="11.137" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor" stop-opacity="0"/><stop offset="1" stop-color="currentColor"/></linearGradient><linearGradient id="svgID11" x1=".975" x2=".975" y1="20.512" y2="10.912" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor"/><stop offset=".105" stop-color="currentColor" stop-opacity=".9"/><stop offset=".904" stop-color="currentColor" stop-opacity=".04"/><stop offset="1" stop-color="currentColor" stop-opacity="0"/></linearGradient><clipPath id="svgID12"><path d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
React
import type { SVGProps } from "react";
export function LobehubPoolside(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor" fillRule="evenodd"><g clipPath="url(#svgID12)"><mask id="svgID8" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="maskType:alpha"><path fill="url(#svgID9)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID10)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID11)" d="M24 0H0v24h24V0z"/></mask><g mask="url(#svgID8)"><path d="M6.742 22.786a11.93 11.93 0 01-5.232-4.963 11.98 11.98 0 01-1.463-6.886.975.975 0 011.943.173c-.178 2.005.246 4 1.226 5.769a9.968 9.968 0 003.526 3.685l4.586-9.405c-1.795-.598-3.29-.338-3.425-.312l-.058.012a.972.972 0 01-1.054-.576c-.24-.448-.96-1.544-1.834-1.97-.873-.426-2.218-.289-2.651-.195a.977.977 0 01-1.087-1.38C4.117.792 11.315-1.686 17.262 1.215c5.946 2.9 8.422 10.093 5.529 16.038l-.01.02c-2.903 5.94-10.095 8.414-16.039 5.514zm6.338-10.773l-4.586 9.405c4.629 1.73 9.896-.192 12.304-4.558-.338-.524-.932-1.275-1.62-1.61-.888-.434-2.19-.292-2.637-.198a.989.989 0 01-.616-.055.984.984 0 01-.49-.473c-.028-.058-.739-1.438-2.355-2.51zM5.81 6.56c.747.365 1.356.944 1.81 1.49 1.406-2.15 3.314-3.774 4.787-4.82a20.81 20.81 0 011.66-1.067A10.078 10.078 0 003.882 6.077c.617.042 1.297.174 1.929.482zm12.671-2.243c.09.624.152 1.294.182 1.965.083 1.801-.021 4.296-.844 6.722.686.018 1.484.14 2.214.495.652.318 1.198.8 1.628 1.28a10.082 10.082 0 00-3.18-10.462zm-5.394 5.46a9.522 9.522 0 012.984 2.287c1.075-3.493.606-7.402.215-8.85-1.381.584-4.75 2.62-6.84 5.618a9.515 9.515 0 013.64.944z"/></g></g><defs><linearGradient id="svgID9" x1="6.75" x2="5.625" y1="20.55" y2="20.55" gradientUnits="userSpaceOnUse"><stop stopColor="currentColor"/><stop offset="1" stopColor="currentColor" stopOpacity="0"/></linearGradient><linearGradient id="svgID10" x1="6.825" x2="7.2" y1="11.85" y2="11.137" gradientUnits="userSpaceOnUse"><stop stopColor="currentColor" stopOpacity="0"/><stop offset="1" stopColor="currentColor"/></linearGradient><linearGradient id="svgID11" x1=".975" x2=".975" y1="20.512" y2="10.912" gradientUnits="userSpaceOnUse"><stop stopColor="currentColor"/><stop offset=".105" stopColor="currentColor" stopOpacity=".9"/><stop offset=".904" stopColor="currentColor" stopOpacity=".04"/><stop offset="1" stopColor="currentColor" stopOpacity="0"/></linearGradient><clipPath id="svgID12"><path d="M0 0h24v24H0z"/></clipPath></defs></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor" fill-rule="evenodd"><g clip-path="url(#svgID12)"><mask id="svgID8" width="24" height="24" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="url(#svgID9)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID10)" d="M24 0H0v24h24V0z"/><path fill="url(#svgID11)" d="M24 0H0v24h24V0z"/></mask><g mask="url(#svgID8)"><path d="M6.742 22.786a11.93 11.93 0 01-5.232-4.963 11.98 11.98 0 01-1.463-6.886.975.975 0 011.943.173c-.178 2.005.246 4 1.226 5.769a9.968 9.968 0 003.526 3.685l4.586-9.405c-1.795-.598-3.29-.338-3.425-.312l-.058.012a.972.972 0 01-1.054-.576c-.24-.448-.96-1.544-1.834-1.97-.873-.426-2.218-.289-2.651-.195a.977.977 0 01-1.087-1.38C4.117.792 11.315-1.686 17.262 1.215c5.946 2.9 8.422 10.093 5.529 16.038l-.01.02c-2.903 5.94-10.095 8.414-16.039 5.514zm6.338-10.773l-4.586 9.405c4.629 1.73 9.896-.192 12.304-4.558-.338-.524-.932-1.275-1.62-1.61-.888-.434-2.19-.292-2.637-.198a.989.989 0 01-.616-.055.984.984 0 01-.49-.473c-.028-.058-.739-1.438-2.355-2.51zM5.81 6.56c.747.365 1.356.944 1.81 1.49 1.406-2.15 3.314-3.774 4.787-4.82a20.81 20.81 0 011.66-1.067A10.078 10.078 0 003.882 6.077c.617.042 1.297.174 1.929.482zm12.671-2.243c.09.624.152 1.294.182 1.965.083 1.801-.021 4.296-.844 6.722.686.018 1.484.14 2.214.495.652.318 1.198.8 1.628 1.28a10.082 10.082 0 00-3.18-10.462zm-5.394 5.46a9.522 9.522 0 012.984 2.287c1.075-3.493.606-7.402.215-8.85-1.381.584-4.75 2.62-6.84 5.618a9.515 9.515 0 013.64.944z"/></g></g><defs><linearGradient id="svgID9" x1="6.75" x2="5.625" y1="20.55" y2="20.55" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor"/><stop offset="1" stop-color="currentColor" stop-opacity="0"/></linearGradient><linearGradient id="svgID10" x1="6.825" x2="7.2" y1="11.85" y2="11.137" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor" stop-opacity="0"/><stop offset="1" stop-color="currentColor"/></linearGradient><linearGradient id="svgID11" x1=".975" x2=".975" y1="20.512" y2="10.912" gradientUnits="userSpaceOnUse"><stop stop-color="currentColor"/><stop offset=".105" stop-color="currentColor" stop-opacity=".9"/><stop offset=".904" stop-color="currentColor" stop-opacity=".04"/><stop offset="1" stop-color="currentColor" stop-opacity="0"/></linearGradient><clipPath id="svgID12"><path d="M0 0h24v24H0z"/></clipPath></defs></g></svg> </template>
CSS
.icon-poolside {
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%3Cg%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20clip-path%3D%22url(%23svgID12)%22%3E%3Cmask%20id%3D%22svgID8%22%20width%3D%2224%22%20height%3D%2224%22%20x%3D%220%22%20y%3D%220%22%20maskUnits%3D%22userSpaceOnUse%22%20style%3D%22mask-type%3Aalpha%22%3E%3Cpath%20fill%3D%22url(%23svgID9)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID10)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID11)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3C%2Fmask%3E%3Cg%20mask%3D%22url(%23svgID8)%22%3E%3Cpath%20d%3D%22M6.742%2022.786a11.93%2011.93%200%2001-5.232-4.963%2011.98%2011.98%200%2001-1.463-6.886.975.975%200%20011.943.173c-.178%202.005.246%204%201.226%205.769a9.968%209.968%200%20003.526%203.685l4.586-9.405c-1.795-.598-3.29-.338-3.425-.312l-.058.012a.972.972%200%2001-1.054-.576c-.24-.448-.96-1.544-1.834-1.97-.873-.426-2.218-.289-2.651-.195a.977.977%200%2001-1.087-1.38C4.117.792%2011.315-1.686%2017.262%201.215c5.946%202.9%208.422%2010.093%205.529%2016.038l-.01.02c-2.903%205.94-10.095%208.414-16.039%205.514zm6.338-10.773l-4.586%209.405c4.629%201.73%209.896-.192%2012.304-4.558-.338-.524-.932-1.275-1.62-1.61-.888-.434-2.19-.292-2.637-.198a.989.989%200%2001-.616-.055.984.984%200%2001-.49-.473c-.028-.058-.739-1.438-2.355-2.51zM5.81%206.56c.747.365%201.356.944%201.81%201.49%201.406-2.15%203.314-3.774%204.787-4.82a20.81%2020.81%200%20011.66-1.067A10.078%2010.078%200%20003.882%206.077c.617.042%201.297.174%201.929.482zm12.671-2.243c.09.624.152%201.294.182%201.965.083%201.801-.021%204.296-.844%206.722.686.018%201.484.14%202.214.495.652.318%201.198.8%201.628%201.28a10.082%2010.082%200%2000-3.18-10.462zm-5.394%205.46a9.522%209.522%200%20012.984%202.287c1.075-3.493.606-7.402.215-8.85-1.381.584-4.75%202.62-6.84%205.618a9.515%209.515%200%20013.64.944z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22svgID9%22%20x1%3D%226.75%22%20x2%3D%225.625%22%20y1%3D%2220.55%22%20y2%3D%2220.55%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID10%22%20x1%3D%226.825%22%20x2%3D%227.2%22%20y1%3D%2211.85%22%20y2%3D%2211.137%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID11%22%20x1%3D%22.975%22%20x2%3D%22.975%22%20y1%3D%2220.512%22%20y2%3D%2210.912%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%2F%3E%3Cstop%20offset%3D%22.105%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%22.9%22%2F%3E%3Cstop%20offset%3D%22.904%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%22.04%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22svgID12%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%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%2024%2024%22%3E%3Cg%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20clip-path%3D%22url(%23svgID12)%22%3E%3Cmask%20id%3D%22svgID8%22%20width%3D%2224%22%20height%3D%2224%22%20x%3D%220%22%20y%3D%220%22%20maskUnits%3D%22userSpaceOnUse%22%20style%3D%22mask-type%3Aalpha%22%3E%3Cpath%20fill%3D%22url(%23svgID9)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID10)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3Cpath%20fill%3D%22url(%23svgID11)%22%20d%3D%22M24%200H0v24h24V0z%22%2F%3E%3C%2Fmask%3E%3Cg%20mask%3D%22url(%23svgID8)%22%3E%3Cpath%20d%3D%22M6.742%2022.786a11.93%2011.93%200%2001-5.232-4.963%2011.98%2011.98%200%2001-1.463-6.886.975.975%200%20011.943.173c-.178%202.005.246%204%201.226%205.769a9.968%209.968%200%20003.526%203.685l4.586-9.405c-1.795-.598-3.29-.338-3.425-.312l-.058.012a.972.972%200%2001-1.054-.576c-.24-.448-.96-1.544-1.834-1.97-.873-.426-2.218-.289-2.651-.195a.977.977%200%2001-1.087-1.38C4.117.792%2011.315-1.686%2017.262%201.215c5.946%202.9%208.422%2010.093%205.529%2016.038l-.01.02c-2.903%205.94-10.095%208.414-16.039%205.514zm6.338-10.773l-4.586%209.405c4.629%201.73%209.896-.192%2012.304-4.558-.338-.524-.932-1.275-1.62-1.61-.888-.434-2.19-.292-2.637-.198a.989.989%200%2001-.616-.055.984.984%200%2001-.49-.473c-.028-.058-.739-1.438-2.355-2.51zM5.81%206.56c.747.365%201.356.944%201.81%201.49%201.406-2.15%203.314-3.774%204.787-4.82a20.81%2020.81%200%20011.66-1.067A10.078%2010.078%200%20003.882%206.077c.617.042%201.297.174%201.929.482zm12.671-2.243c.09.624.152%201.294.182%201.965.083%201.801-.021%204.296-.844%206.722.686.018%201.484.14%202.214.495.652.318%201.198.8%201.628%201.28a10.082%2010.082%200%2000-3.18-10.462zm-5.394%205.46a9.522%209.522%200%20012.984%202.287c1.075-3.493.606-7.402.215-8.85-1.381.584-4.75%202.62-6.84%205.618a9.515%209.515%200%20013.64.944z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22svgID9%22%20x1%3D%226.75%22%20x2%3D%225.625%22%20y1%3D%2220.55%22%20y2%3D%2220.55%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID10%22%20x1%3D%226.825%22%20x2%3D%227.2%22%20y1%3D%2211.85%22%20y2%3D%2211.137%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22svgID11%22%20x1%3D%22.975%22%20x2%3D%22.975%22%20y1%3D%2220.512%22%20y2%3D%2210.912%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22currentColor%22%2F%3E%3Cstop%20offset%3D%22.105%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%22.9%22%2F%3E%3Cstop%20offset%3D%22.904%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%22.04%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22currentColor%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3CclipPath%20id%3D%22svgID12%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/lobehub/poolside.svg?color=%231a73e8&size=48