Cloudflare icon

logos:cloudflare

The Cloudflare icon (logos:cloudflare) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 76 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: 512 × 76

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="76" viewBox="0 0 512 76"><path d="M214.633 47.4h7.505v20.704h13.096v6.643h-20.6zm28.361 13.751v-.08c0-7.856 6.257-14.218 14.61-14.218c8.35 0 14.529 6.295 14.529 14.138v.08c0 7.853-6.257 14.218-14.61 14.218s-14.531-6.287-14.531-14.138zm21.49 0v-.08c0-3.948-2.82-7.384-6.96-7.384c-4.142 0-6.84 3.356-6.84 7.304v.08c0 3.945 2.816 7.384 6.92 7.384c4.1 0 6.88-3.358 6.88-7.304m16.827 1.602V47.41h7.613v15.197c0 3.945 1.965 5.815 4.982 5.815c3.014 0 4.982-1.8 4.982-5.627V47.4h7.61v15.157c0 8.832-4.983 12.69-12.673 12.69s-12.524-3.948-12.524-12.5m36.674-15.34h10.438c9.658 0 15.262 5.625 15.262 13.508v.08c0 7.882-5.685 13.747-15.42 13.747h-10.28V47.4v.01zm10.546 20.621c4.487 0 7.454-2.497 7.454-6.912v-.08c0-4.377-2.974-6.915-7.454-6.915h-3.055v13.907zM354.575 47.4h21.637v6.646h-14.145v4.643h12.79v6.287h-12.79v9.771h-7.492zm32.068 0h7.502v20.704h13.098v6.643h-20.6zm40.19-.193h7.223l11.517 27.535h-8.036l-1.978-4.884H425.12l-1.928 4.884h-7.888l11.517-27.535zm6.572 16.755l-3.016-7.773l-3.055 7.773zm21.828-16.554h12.79c4.134 0 7 1.099 8.807 2.966c1.594 1.559 2.394 3.677 2.394 6.365v.08c0 4.177-2.206 6.953-5.566 8.393l6.455 9.53h-8.659l-5.446-8.282h-3.283v8.282h-7.502V47.4l.01.01zm12.446 13.126c2.55 0 4.021-1.247 4.021-3.238v-.077c0-2.149-1.54-3.238-4.06-3.238h-4.905v6.566h4.952l-.008-.01zM490.044 47.4h21.758v6.445h-14.334v4.136h12.988v5.984h-12.988v4.337H512v6.445h-21.956zM198.212 64.356c-1.05 2.4-3.263 4.099-6.2 4.099c-4.09 0-6.916-3.439-6.916-7.384v-.083c0-3.948 2.745-7.303 6.839-7.303c3.084 0 5.436 1.917 6.435 4.535h7.898c-1.267-6.503-6.92-11.37-14.263-11.37c-8.343 0-14.61 6.365-14.61 14.219v.08c0 7.853 6.177 14.138 14.532 14.138c7.136 0 12.72-4.679 14.193-10.943h-7.918l.01.01z"/><path fill="#fbad41" d="M132.234 32.698c-.552 0-1.097.02-1.641.037a.8.8 0 0 0-.256.06a.92.92 0 0 0-.593.64l-2.334 8.155c-1.006 3.506-.632 6.744 1.06 9.12c1.55 2.2 4.13 3.49 7.263 3.64l12.662.768c.376.02.702.2.9.5c.211.322.258.725.129 1.089a1.61 1.61 0 0 1-1.373 1.069l-13.157.768c-7.147.331-14.838 6.164-17.536 13.277l-.948 2.51a.703.703 0 0 0 .622.958h45.312a1.205 1.205 0 0 0 1.165-.878a33 33 0 0 0 1.204-8.885c0-18.12-14.529-32.808-32.459-32.808"/><path fill="#f6821f" d="m112.457 74.235l.838-2.949c1.009-3.506.635-6.744-1.054-9.12c-1.556-2.2-4.134-3.49-7.268-3.64l-59.395-.768a1.17 1.17 0 0 1-.939-.5a1.24 1.24 0 0 1-.13-1.089a1.61 1.61 0 0 1 1.385-1.069l59.95-.768c7.117-.329 14.807-6.164 17.505-13.277l3.419-9.035a2.3 2.3 0 0 0 .1-1.197C122.973 13.199 107.392 0 88.764 0c-17.172 0-31.741 11.199-36.97 26.767A17.37 17.37 0 0 0 39.47 23.32c-8.232.828-14.858 7.534-15.676 15.857a18 18 0 0 0 .452 6.204C10.792 45.78 0 56.92 0 70.608c0 1.238.088 2.457.266 3.647c.073.577.565 1.01 1.147 1.009h109.688a1.43 1.43 0 0 0 1.356-1.05"/></svg>

How to use the Cloudflare icon

React

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

<Icon icon="logos:cloudflare" width="24" />

Vue

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

<template>
  <Icon icon="logos:cloudflare" width="24" />
</template>

Svelte

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

<Icon icon="logos:cloudflare" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--cloudflare]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:cloudflare"></div>

Web component

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

<iconify-icon icon="logos:cloudflare"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/logos/cloudflare.svg" alt="Cloudflare icon" width="24" height="24">

Related icons in SVG Logos

Cloudflare icon in other icon sets

Cloudflare icon FAQ

Is the Cloudflare 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 Cloudflare icon in React?

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

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

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

Browse all SVG Logos icons →