Beach With Umbrella emoji favicon

🏖️ Beach With Umbrella Favicon — Convert Emoji to Favicon | favicon.im

Convert Beach With Umbrella emoji (🏖️) to favicon for your website. Download in multiple sizes (16x16 to 512x512), customize colors and shape. Free emoji to favicon converter.

Download

Emoji Info

Name 🏖️ Beach With Umbrella
Unicode U+1F3D6-U+FE0F
Category Travel & Places
Keywords
beachwithumbrella

Platform Comparison

Beach With Umbrella Twemoji Twemoji
Beach With Umbrella Noto Noto

Similar Emoji Favicons

Style Variants

Beach With Umbrella White Square White / Square
Beach With Umbrella White Rounded White / Rounded
Beach With Umbrella White Circle White / Circle
Beach With Umbrella Black Square Black / Square
Beach With Umbrella Black Rounded Black / Rounded
Beach With Umbrella Black Circle Black / Circle
Beach With Umbrella Dark Blue Square Dark Blue / Square
Beach With Umbrella Dark Blue Rounded Dark Blue / Rounded
Beach With Umbrella Dark Blue Circle Dark Blue / Circle
Beach With Umbrella Light Gray Square Light Gray / Square
Beach With Umbrella Light Gray Rounded Light Gray / Rounded
Beach With Umbrella Light Gray Circle Light Gray / Circle
Beach With Umbrella Blue Square Blue / Square
Beach With Umbrella Blue Rounded Blue / Rounded
Beach With Umbrella Blue Circle Blue / Circle
Beach With Umbrella Green Square Green / Square
Beach With Umbrella Green Rounded Green / Rounded
Beach With Umbrella Green Circle Green / Circle

Customize Your Favicon

#ffffff
Download 512x512
Custom preview

How to Use

Add the converted Beach With Umbrella emoji favicon to your website with these code snippets. Simply copy and paste to convert this emoji to your site's favicon.

HTML

<link rel="icon" type="image/png" sizes="32x32" href="https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D32/w/32/h/32/output/png">
<link rel="icon" type="image/png" sizes="16x16" href="https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D16/w/16/h/16/output/png">
<link rel="apple-touch-icon" sizes="180x180" href="https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D180/w/180/h/180/output/png">

Next.js (app/layout.tsx)

export const metadata = {
  icons: {
    icon: [
      { url: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D32/w/32/h/32/output/png', sizes: '32x32', type: 'image/png' },
      { url: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D16/w/16/h/16/output/png', sizes: '16x16', type: 'image/png' },
    ],
    apple: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D180/w/180/h/180/output/png',
  },
}

Nuxt 3 (nuxt.config.ts)

export default defineNuxtConfig({
  app: {
    head: {
      link: [
        { rel: 'icon', type: 'image/png', sizes: '32x32', href: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D32/w/32/h/32/output/png' },
        { rel: 'icon', type: 'image/png', sizes: '16x16', href: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D16/w/16/h/16/output/png' },
        { rel: 'apple-touch-icon', sizes: '180x180', href: 'https://cdn.smaller.app/https%3A%2F%2Ffavicon.im%2Femoji-favicon%2Frender%3Femoji%3D%25F0%259F%258F%2596%25EF%25B8%258F%26size%3D180/w/180/h/180/output/png' },
      ]
    }
  }
})

Related Emoji Favicons