ICONYZ
English
Bl icon from Circle Flags

Bl icon

circle-flags:bl

The Bl icon (circle-flags:bl) is a free SVG icon from the Circle Flags set by HatScripts. It is drawn on a 512 × 512 grid. Circle Flags icons are released under the MIT 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
Circle Flags
Author
HatScripts
License
MIT
Size
512 × 512
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#eee" d="M0 0h512v512H0z"/><path fill="#acabb1" d="M167 178a28 28 0 0 0-28 28H55a28 28 0 0 0 28 28a28 28 0 0 0 28 28a28 28 0 0 0 28 28h234a28 28 0 0 0 28-28a28 28 0 0 0 28-28a28 28 0 0 0 28-28h-84a28 28 0 0 0-28-28z"/><path fill="#ffda44" d="M123 357h44v44h-44zm222 0h44v44h-44zm-178 11h178v44H167zm67-268v33.5L223 145l-12-6v-17h-44v56l89 14l89-14v-56h-44v17l-12 6l-11-11.5V100z"/><path fill="#0052b4" d="M167 178v112c0 68 89 88.5 89 88.5s89-20.4 89-88.5V178z"/><path fill="#d80027" d="M167 222.1h178v69H167z"/></g></svg>

How to use the Bl icon

React

import { Icon } from "@iconify/react";

<Icon icon="circle-flags:bl" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="circle-flags:bl" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="circle-flags:bl" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[circle-flags--bl]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/circle-flags -->
<div class="i-circle-flags:bl"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="circle-flags:bl"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/circle-flags/bl.svg" alt="Bl icon" width="24" height="24">

Bl icon in other icon sets

Bl icon FAQ

Is the Bl icon free for commercial use?

Yes. Circle Flags icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Bl icon in React?

Install @iconify/react and render <Icon icon="circle-flags:bl" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Bl icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/circle-flags/bl.svg" alt="Bl icon">, or paste the SVG code inline to style it with CSS.

Browse all Circle Flags icons →