Flutter Icon icon
logos:flutter-icon
The Flutter Icon icon (logos:flutter-icon) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 256 × 284 grid. SVG Logos icons are released under the CC0 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
- SVG Logos
- Author
- Gil Barbara
- License
- CC0-1.0
- Size
- 256 × 284
- Tags
- fluttericon
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="284" viewBox="0 0 256 284"><defs><radialGradient id="SVGXxQ1kd1i" cx="2.814%" cy="6.818%" r="151.475%" fx="2.814%" fy="6.818%" gradientTransform="matrix(1 0 0 .8077 0 .013)"><stop offset="0%" stop-color="#fff" stop-opacity=".1"/><stop offset="100%" stop-color="#fff" stop-opacity="0"/></radialGradient><linearGradient id="SVGL0EyQbrD" x1="19.657%" x2="69.874%" y1="81.493%" y2="47.643%"><stop offset="0%" stop-color="#1a237e" stop-opacity=".4"/><stop offset="100%" stop-color="#1a237e" stop-opacity="0"/></linearGradient></defs><path fill="#54c5f8" d="M228.864 130.789h-87.187l-76.278 76.296l43.585 43.584zM43.603 185.284L0 141.681L141.681 0h87.187z"/><path fill="#01579b" d="m108.988 250.67l32.693 32.693h87.187l-76.295-76.277z"/><path fill="url(#SVGL0EyQbrD)" d="m108.988 250.67l64.658-22.383l-21.073-21.201z"/><path fill="#29b6f6" d="m108.982 163.478l-43.586 43.585l43.586 43.586l43.585-43.586z"/><path fill="url(#SVGXxQ1kd1i)" d="m228.868 130.79l-76.277 76.277l76.277 76.296h-87.187l-32.693-32.693l-43.602-43.603l76.295-76.278zM141.681 0L0 141.681l43.603 43.603L228.868 0z"/></svg>How to use the Flutter Icon icon
React
import { Icon } from "@iconify/react";
<Icon icon="logos:flutter-icon" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="logos:flutter-icon" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="logos:flutter-icon" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--flutter-icon]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:flutter-icon"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="logos:flutter-icon"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/logos/flutter-icon.svg" alt="Flutter Icon icon" width="24" height="24">Related icons in SVG Logos
Flutter Icon icon FAQ
Is the Flutter Icon icon free for commercial use?
Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.
How do I use the Flutter Icon icon in React?
Install @iconify/react and render <Icon icon="logos:flutter-icon" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Flutter Icon icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/flutter-icon.svg" alt="Flutter Icon icon">, or paste the SVG code inline to style it with CSS.