Foursquare icon
el:foursquare
The Foursquare icon (el:foursquare) is a free SVG icon from the Elusive Icons set by Team Redux. It is drawn on a 1200 × 1200 grid. Elusive Icons are released under the Open Font License, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Elusive Icons
- Author
- Team Redux
- License
- OFL-1.1
- Size
- 1200 × 1200
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="1200" viewBox="0 0 1200 1200"><path fill="currentColor" d="M0 0v1200h1200V343.799L931.055 570.85c21.353 21.928 21.911 53.832-1.245 78.662L654.492 926.001c-23.001 22.439-54.232 23.539-81.152 0L328.491 681.152c-62.878-3.806-120.201-33.892-166.113-83.716c-40.534-47.473-60.491-107.969-57.129-175.635c5.604-62.7 33.906-119.527 83.716-165.527c43.212-36.103 96.368-56.79 157.324-58.374c69.226.551 133.452 29.644 183.911 84.961c4.228 5.074 8.279 10.397 12.085 15.894s7.384 10.746 10.767 15.82l20.288-20.288c23.001-22.44 54.232-23.539 81.152 0l81.226 81.226L1009.717 0zm1068.091 0L624.097 610.107c-4.228 5.074-9.314 7.69-15.234 7.69s-10.134-2.145-12.671-6.372c-1.691-.846-9.32-10.146-22.852-27.905s-29.988-39.775-49.438-65.991c.176-1.101.286-2.148.439-3.223c9.497-22.87 14.722-47.888 14.722-74.194c0-107.015-86.711-193.799-193.726-193.799s-193.799 86.784-193.799 193.799s86.784 193.726 193.799 193.726c23.367 0 45.761-4.139 66.504-11.719c.037-.014.036.014.073 0c.951-.186 1.894-.32 2.856-.513l183.984 148.389c2.537 2.537 5.007 3.809 7.544 3.809h3.809c4.229 0 7.644-1.271 10.181-3.809L1200 281.616V0z"/></svg>
How to use the Foursquare icon
React
import { Icon } from "@iconify/react";
<Icon icon="el:foursquare" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="el:foursquare" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="el:foursquare" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[el--foursquare]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/el -->
<div class="i-el:foursquare"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="el:foursquare"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/el/foursquare.svg" alt="Foursquare icon" width="24" height="24">
Foursquare icon in other icon sets
Foursquare icon FAQ
Is the Foursquare icon free for commercial use?
Yes. Elusive Icons are released under the Open Font License, which allows use in personal and commercial projects.
How do I use the Foursquare icon in React?
Install @iconify/react and render <Icon icon="el:foursquare" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Foursquare icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/el/foursquare.svg" alt="Foursquare icon">, or paste the SVG code inline to style it with CSS.
Browse all Elusive Icons →
ICONYZ
