beach with umbrella emoji

beach-with-umbrella from Emoji One (Colored) by Emoji One · Default · Travel · CC-BY-4.0 Attribution required.

Name
beach-with-umbrella
Set
Emoji One (Colored)
Style
Default
Category
Travel
Viewbox
64×64
License
CC BY 4.0

The same emoji in other sets

beach-with-umbrellaFluent Emojibeach-with-umbrellaFluent Emoji Flatbeach-with-umbrellaFluent Emoji High Contrastbeach-with-umbrellaNoto Emojibeach-with-umbrellaOpenMojibeach-with-umbrellaTwitter Emoji

More travel icons from Emoji One (Colored)

aerial-tramwayairplaneairplane-arrivalairplane-departureambulanceanchorarticulated-lorryautomobilebankbicyclebridge-at-nightbuilding-constructionbullet-trainbusbus-stopcampingcanoecarousel-horsecastlechurchcityscapecityscape-at-duskclassical-buildingconstruction

Use the beach with umbrella emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#d6eef0" d="M0 0h64v64H0z"/><circle cx="52" cy="12" r="7" fill="#ffe62e"/><g fill="#fff"><path d="M22 7c0 1.1-.9 2-2 2H10c-1.1 0-2-.9-2-2s.9-2 2-2h10c1.1 0 2 .9 2 2"/><path d="M26 9c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m14 3c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m-21 7c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2"/></g><path fill="#6adbc6" d="M0 32h64v32H0z"/><path fill="#ffdd7d" d="M64 40s-78.4-.9-46.3 24H64z"/><path fill="#94989b" d="M39.1 53.2c-.1.5-.6.9-1.2.8c-.5-.1-.9-.6-.8-1.2L41.8 29c.1-.5.6-.9 1.2-.8c.5.1.9.6.8 1.2z"/><path fill="#f27a52" d="M41.6 35.2c3.7.7 3.2 3.6 6.2 4.2c2.9.6 3.6-2.3 7.3-1.6l.8.1c.5 1.4 1.3 1 1.8-.9l.2-.8c1.7-8.6-10.3-12.9-10.3-12.9c-1.7-.9-4.8-1.5-6.8-1.3c0 0-12.8-.4-14.5 8.2l-.2.8c-.3 1.9.3 2.6 1.4 1.5l.8.1c3.7.7 3.2 3.6 6.2 4.2c2.7.6 3.4-2.3 7.1-1.6"/><path fill="#f9f3d9" d="m46.4 25.1l-.3-.1c-.4-.2-.8-.4-1.3-.5c.5 2.9 1.3 7.6 1.8 12.2c.3.4.6.6 1 .6c.6.1.9-.1 1.7-.6c1.1-.7 2.7-1.6 5.3-1.2l.3.1c1.3-6.8-8.4-10.5-8.5-10.5"/><path fill="#c94747" d="M41 24h-.3c-.1 0-10.1-.1-11.5 6.7l.3.1c2.5.5 3.5 1.9 4.2 3c.5.8.8 1 1.3 1.1s.9-.1 1.6-.6c.1 0 .1-.1.2-.1c2.1-3.9 4.4-7.8 5.9-10.2c-.6 0-1.2-.1-1.7 0"/></svg>

React

import type { SVGProps } from "react";

export function EmojioneBeachWithUmbrella(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#d6eef0" d="M0 0h64v64H0z"/><circle cx="52" cy="12" r="7" fill="#ffe62e"/><g fill="#fff"><path d="M22 7c0 1.1-.9 2-2 2H10c-1.1 0-2-.9-2-2s.9-2 2-2h10c1.1 0 2 .9 2 2"/><path d="M26 9c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m14 3c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m-21 7c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2"/></g><path fill="#6adbc6" d="M0 32h64v32H0z"/><path fill="#ffdd7d" d="M64 40s-78.4-.9-46.3 24H64z"/><path fill="#94989b" d="M39.1 53.2c-.1.5-.6.9-1.2.8c-.5-.1-.9-.6-.8-1.2L41.8 29c.1-.5.6-.9 1.2-.8c.5.1.9.6.8 1.2z"/><path fill="#f27a52" d="M41.6 35.2c3.7.7 3.2 3.6 6.2 4.2c2.9.6 3.6-2.3 7.3-1.6l.8.1c.5 1.4 1.3 1 1.8-.9l.2-.8c1.7-8.6-10.3-12.9-10.3-12.9c-1.7-.9-4.8-1.5-6.8-1.3c0 0-12.8-.4-14.5 8.2l-.2.8c-.3 1.9.3 2.6 1.4 1.5l.8.1c3.7.7 3.2 3.6 6.2 4.2c2.7.6 3.4-2.3 7.1-1.6"/><path fill="#f9f3d9" d="m46.4 25.1l-.3-.1c-.4-.2-.8-.4-1.3-.5c.5 2.9 1.3 7.6 1.8 12.2c.3.4.6.6 1 .6c.6.1.9-.1 1.7-.6c1.1-.7 2.7-1.6 5.3-1.2l.3.1c1.3-6.8-8.4-10.5-8.5-10.5"/><path fill="#c94747" d="M41 24h-.3c-.1 0-10.1-.1-11.5 6.7l.3.1c2.5.5 3.5 1.9 4.2 3c.5.8.8 1 1.3 1.1s.9-.1 1.6-.6c.1 0 .1-.1.2-.1c2.1-3.9 4.4-7.8 5.9-10.2c-.6 0-1.2-.1-1.7 0"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#d6eef0" d="M0 0h64v64H0z"/><circle cx="52" cy="12" r="7" fill="#ffe62e"/><g fill="#fff"><path d="M22 7c0 1.1-.9 2-2 2H10c-1.1 0-2-.9-2-2s.9-2 2-2h10c1.1 0 2 .9 2 2"/><path d="M26 9c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m14 3c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2m-21 7c0 1.1-.9 2-2 2h-4c-1.1 0-2-.9-2-2s.9-2 2-2h4c1.1 0 2 .9 2 2"/></g><path fill="#6adbc6" d="M0 32h64v32H0z"/><path fill="#ffdd7d" d="M64 40s-78.4-.9-46.3 24H64z"/><path fill="#94989b" d="M39.1 53.2c-.1.5-.6.9-1.2.8c-.5-.1-.9-.6-.8-1.2L41.8 29c.1-.5.6-.9 1.2-.8c.5.1.9.6.8 1.2z"/><path fill="#f27a52" d="M41.6 35.2c3.7.7 3.2 3.6 6.2 4.2c2.9.6 3.6-2.3 7.3-1.6l.8.1c.5 1.4 1.3 1 1.8-.9l.2-.8c1.7-8.6-10.3-12.9-10.3-12.9c-1.7-.9-4.8-1.5-6.8-1.3c0 0-12.8-.4-14.5 8.2l-.2.8c-.3 1.9.3 2.6 1.4 1.5l.8.1c3.7.7 3.2 3.6 6.2 4.2c2.7.6 3.4-2.3 7.1-1.6"/><path fill="#f9f3d9" d="m46.4 25.1l-.3-.1c-.4-.2-.8-.4-1.3-.5c.5 2.9 1.3 7.6 1.8 12.2c.3.4.6.6 1 .6c.6.1.9-.1 1.7-.6c1.1-.7 2.7-1.6 5.3-1.2l.3.1c1.3-6.8-8.4-10.5-8.5-10.5"/><path fill="#c94747" d="M41 24h-.3c-.1 0-10.1-.1-11.5 6.7l.3.1c2.5.5 3.5 1.9 4.2 3c.5.8.8 1 1.3 1.1s.9-.1 1.6-.6c.1 0 .1-.1.2-.1c2.1-3.9 4.4-7.8 5.9-10.2c-.6 0-1.2-.1-1.7 0"/></svg>
</template>

CSS

.icon-beach-with-umbrella {
  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%2064%2064%22%3E%3Cpath%20fill%3D%22%23d6eef0%22%20d%3D%22M0%200h64v64H0z%22%2F%3E%3Ccircle%20cx%3D%2252%22%20cy%3D%2212%22%20r%3D%227%22%20fill%3D%22%23ffe62e%22%2F%3E%3Cg%20fill%3D%22%23fff%22%3E%3Cpath%20d%3D%22M22%207c0%201.1-.9%202-2%202H10c-1.1%200-2-.9-2-2s.9-2%202-2h10c1.1%200%202%20.9%202%202%22%2F%3E%3Cpath%20d%3D%22M26%209c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202m14%203c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202m-21%207c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202%22%2F%3E%3C%2Fg%3E%3Cpath%20fill%3D%22%236adbc6%22%20d%3D%22M0%2032h64v32H0z%22%2F%3E%3Cpath%20fill%3D%22%23ffdd7d%22%20d%3D%22M64%2040s-78.4-.9-46.3%2024H64z%22%2F%3E%3Cpath%20fill%3D%22%2394989b%22%20d%3D%22M39.1%2053.2c-.1.5-.6.9-1.2.8c-.5-.1-.9-.6-.8-1.2L41.8%2029c.1-.5.6-.9%201.2-.8c.5.1.9.6.8%201.2z%22%2F%3E%3Cpath%20fill%3D%22%23f27a52%22%20d%3D%22M41.6%2035.2c3.7.7%203.2%203.6%206.2%204.2c2.9.6%203.6-2.3%207.3-1.6l.8.1c.5%201.4%201.3%201%201.8-.9l.2-.8c1.7-8.6-10.3-12.9-10.3-12.9c-1.7-.9-4.8-1.5-6.8-1.3c0%200-12.8-.4-14.5%208.2l-.2.8c-.3%201.9.3%202.6%201.4%201.5l.8.1c3.7.7%203.2%203.6%206.2%204.2c2.7.6%203.4-2.3%207.1-1.6%22%2F%3E%3Cpath%20fill%3D%22%23f9f3d9%22%20d%3D%22m46.4%2025.1l-.3-.1c-.4-.2-.8-.4-1.3-.5c.5%202.9%201.3%207.6%201.8%2012.2c.3.4.6.6%201%20.6c.6.1.9-.1%201.7-.6c1.1-.7%202.7-1.6%205.3-1.2l.3.1c1.3-6.8-8.4-10.5-8.5-10.5%22%2F%3E%3Cpath%20fill%3D%22%23c94747%22%20d%3D%22M41%2024h-.3c-.1%200-10.1-.1-11.5%206.7l.3.1c2.5.5%203.5%201.9%204.2%203c.5.8.8%201%201.3%201.1s.9-.1%201.6-.6c.1%200%20.1-.1.2-.1c2.1-3.9%204.4-7.8%205.9-10.2c-.6%200-1.2-.1-1.7%200%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%2064%2064%22%3E%3Cpath%20fill%3D%22%23d6eef0%22%20d%3D%22M0%200h64v64H0z%22%2F%3E%3Ccircle%20cx%3D%2252%22%20cy%3D%2212%22%20r%3D%227%22%20fill%3D%22%23ffe62e%22%2F%3E%3Cg%20fill%3D%22%23fff%22%3E%3Cpath%20d%3D%22M22%207c0%201.1-.9%202-2%202H10c-1.1%200-2-.9-2-2s.9-2%202-2h10c1.1%200%202%20.9%202%202%22%2F%3E%3Cpath%20d%3D%22M26%209c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202m14%203c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202m-21%207c0%201.1-.9%202-2%202h-4c-1.1%200-2-.9-2-2s.9-2%202-2h4c1.1%200%202%20.9%202%202%22%2F%3E%3C%2Fg%3E%3Cpath%20fill%3D%22%236adbc6%22%20d%3D%22M0%2032h64v32H0z%22%2F%3E%3Cpath%20fill%3D%22%23ffdd7d%22%20d%3D%22M64%2040s-78.4-.9-46.3%2024H64z%22%2F%3E%3Cpath%20fill%3D%22%2394989b%22%20d%3D%22M39.1%2053.2c-.1.5-.6.9-1.2.8c-.5-.1-.9-.6-.8-1.2L41.8%2029c.1-.5.6-.9%201.2-.8c.5.1.9.6.8%201.2z%22%2F%3E%3Cpath%20fill%3D%22%23f27a52%22%20d%3D%22M41.6%2035.2c3.7.7%203.2%203.6%206.2%204.2c2.9.6%203.6-2.3%207.3-1.6l.8.1c.5%201.4%201.3%201%201.8-.9l.2-.8c1.7-8.6-10.3-12.9-10.3-12.9c-1.7-.9-4.8-1.5-6.8-1.3c0%200-12.8-.4-14.5%208.2l-.2.8c-.3%201.9.3%202.6%201.4%201.5l.8.1c3.7.7%203.2%203.6%206.2%204.2c2.7.6%203.4-2.3%207.1-1.6%22%2F%3E%3Cpath%20fill%3D%22%23f9f3d9%22%20d%3D%22m46.4%2025.1l-.3-.1c-.4-.2-.8-.4-1.3-.5c.5%202.9%201.3%207.6%201.8%2012.2c.3.4.6.6%201%20.6c.6.1.9-.1%201.7-.6c1.1-.7%202.7-1.6%205.3-1.2l.3.1c1.3-6.8-8.4-10.5-8.5-10.5%22%2F%3E%3Cpath%20fill%3D%22%23c94747%22%20d%3D%22M41%2024h-.3c-.1%200-10.1-.1-11.5%206.7l.3.1c2.5.5%203.5%201.9%204.2%203c.5.8.8%201%201.3%201.1s.9-.1%201.6-.6c.1%200%20.1-.1.2-.1c2.1-3.9%204.4-7.8%205.9-10.2c-.6%200-1.2-.1-1.7%200%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/beach-with-umbrella.svg?color=%231a73e8&size=48