Spinnaker icon

logos:spinnaker

The Spinnaker icon (logos:spinnaker) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 256 × 297 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 × 297
Tags: sninnaker

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="297" viewBox="0 0 256 297"><defs><linearGradient id="SVGXZ3tEdUM" x1="82.179%" x2="34.613%" y1="6.032%" y2="106.135%"><stop offset="0%" stop-color="#2b3990"/><stop offset="16%" stop-color="#1e62a7"/><stop offset="32%" stop-color="#1485bc"/><stop offset="49%" stop-color="#0ba1cc"/><stop offset="66%" stop-color="#05b4d7"/><stop offset="83%" stop-color="#01c0de"/><stop offset="100%" stop-color="#00c4e0"/></linearGradient><linearGradient id="SVG0iFhHeqp" x1="-31668%" x2="-19806%" y1="78954%" y2="78954%"><stop offset="0%" stop-color="#2b3990"/><stop offset="16%" stop-color="#1e62a7"/><stop offset="32%" stop-color="#1485bc"/><stop offset="49%" stop-color="#0ba1cc"/><stop offset="66%" stop-color="#05b4d7"/><stop offset="83%" stop-color="#01c0de"/><stop offset="100%" stop-color="#00c4e0"/></linearGradient></defs><path fill="url(#SVGXZ3tEdUM)" d="M21.943 218.333c98.86 9.8 178.241-48.676 198.043-73.732C239.788 119.544 209.763 0 209.763 0c-32.546 79.956-91.723 201.14-187.82 218.373z"/><path fill="url(#SVG0iFhHeqp)" d="M67.657 186.424c58.315 2.147 102.702-34.523 113.402-49.725s-5.683-83.67-5.683-83.67c-16.206 47.43-61.298 116.543-107.719 133.395"/><path fill="#149cb5" d="M3.805 269.93a21 21 0 0 0 6.322 4.488a17.7 17.7 0 0 0 7.554 1.7a12.05 12.05 0 0 0 7.748-2.23a7.13 7.13 0 0 0 2.767-5.848a7.2 7.2 0 0 0-.65-3.209a7 7 0 0 0-1.757-2.257a13 13 0 0 0-2.643-1.7l-3.265-1.577l-7.208-3.087a34 34 0 0 1-3.597-1.809a14.7 14.7 0 0 1-3.293-2.556a12.2 12.2 0 0 1-2.38-3.576a12.4 12.4 0 0 1 .263-9.981A12.8 12.8 0 0 1 6.96 234.1a15.4 15.4 0 0 1 4.98-2.72a19.6 19.6 0 0 1 6.324-.979c2.858-.019 5.688.56 8.3 1.7a21 21 0 0 1 6.517 4.406l-3.445 4.079a18 18 0 0 0-5.105-3.427a15.45 15.45 0 0 0-6.323-1.237a11.06 11.06 0 0 0-6.793 1.917a6.26 6.26 0 0 0-2.573 5.317a5.94 5.94 0 0 0 .733 3.046a7.6 7.6 0 0 0 2.006 2.135c.836.64 1.735 1.196 2.684 1.659q1.453.72 2.989 1.36l7.139 3.018a31 31 0 0 1 4.067 2.067a14.6 14.6 0 0 1 3.293 2.72a11.8 11.8 0 0 1 2.186 3.617c.562 1.534.834 3.156.802 4.786a12.9 12.9 0 0 1-1.19 5.44a13.3 13.3 0 0 1-3.417 4.487a16.3 16.3 0 0 1-5.368 3.019a21.7 21.7 0 0 1-7.125 1.087c-6.655.056-13.037-2.591-17.64-7.315z"/><path fill="#149cb5" d="M40.756 283.86v12.369h-6.013v-52.116h4.982l.515 4.218h.225a27 27 0 0 1 5.286-3.62a12.9 12.9 0 0 1 6.04-1.51c2.1-.03 4.18.436 6.079 1.361a11.9 11.9 0 0 1 4.4 3.77a17.9 17.9 0 0 1 2.643 5.878c.638 2.522.945 5.122.912 7.728a25.8 25.8 0 0 1-1.242 8.342a19.5 19.5 0 0 1-3.37 6.218a14.3 14.3 0 0 1-4.903 3.878a13.54 13.54 0 0 1-5.854 1.36a11.7 11.7 0 0 1-4.943-1.128a25 25 0 0 1-4.942-3.09zm0-11.24a15.9 15.9 0 0 0 4.691 2.98c1.263.524 2.604.819 3.965.87a8.35 8.35 0 0 0 4.07-1.02a9.8 9.8 0 0 0 3.225-2.87a14.2 14.2 0 0 0 2.127-4.56a22.4 22.4 0 0 0 .767-6.109a27.4 27.4 0 0 0-.516-5.443a12.5 12.5 0 0 0-1.652-4.259a8 8 0 0 0-2.933-2.721a8.8 8.8 0 0 0-4.282-.98a9.37 9.37 0 0 0-4.573 1.28a27 27 0 0 0-4.942 3.7zm31.477-36.208a4.9 4.9 0 0 1-3.256-1.108c-.843-.737-1.32-1.76-1.32-2.83s.477-2.095 1.32-2.83c1.888-1.43 4.608-1.43 6.497 0c.846.734 1.326 1.758 1.326 2.83c0 1.071-.48 2.095-1.326 2.83a4.88 4.88 0 0 1-3.241 1.108m-3.372 7.395h6.584v35.964H68.86zm11.596.271H85.6l.526 5.141h.23a29.6 29.6 0 0 1 5.492-4.293a12.8 12.8 0 0 1 6.747-1.722q5.763 0 8.421 3.524q2.659 3.524 2.7 10.427v22.616h-6.14v-21.808q0-5.06-1.647-7.3a6.07 6.07 0 0 0-5.236-2.239a9.07 9.07 0 0 0-5.007 1.391a32.3 32.3 0 0 0-4.94 4.108v25.848h-6.14zm32.914.001h5.097l.528 5.14h.23a29.7 29.7 0 0 1 5.502-4.292a12.83 12.83 0 0 1 6.76-1.723q5.773 0 8.437 3.524t2.704 10.427v22.616h-6.274v-21.807q0-5.062-1.65-7.3a6.09 6.09 0 0 0-5.245-2.24a9.1 9.1 0 0 0-5.016 1.391a32.4 32.4 0 0 0-4.948 4.108v25.848h-6.125zM146.3 271.2c-.091-3.858 2.05-7.432 5.524-9.224q5.523-3.206 17.413-4.483c0-1.136-.115-2.27-.345-3.383a8.1 8.1 0 0 0-1.23-2.934a6.6 6.6 0 0 0-2.333-2.065a7.8 7.8 0 0 0-3.756-.788a15.2 15.2 0 0 0-6.09 1.21a30 30 0 0 0-5.013 2.716l-2.527-4.293a41 41 0 0 1 6.353-3.206a21.5 21.5 0 0 1 8.285-1.548q6.808 0 9.873 4.075a17.9 17.9 0 0 1 3.066 10.95v22.456h-5.206l-.539-4.361h-.152a31 31 0 0 1-5.772 3.722a14.5 14.5 0 0 1-6.545 1.549a11.48 11.48 0 0 1-7.844-2.717a9.66 9.66 0 0 1-3.162-7.676m6.2-.448a5.19 5.19 0 0 0 1.878 4.524a7.7 7.7 0 0 0 4.626 1.358a10.96 10.96 0 0 0 5.096-1.25a24.7 24.7 0 0 0 5.095-3.654v-10.162a66 66 0 0 0-7.885 1.427a21 21 0 0 0-5.164 1.956a7.34 7.34 0 0 0-2.762 2.595a6.3 6.3 0 0 0-.884 3.206m24.871-44.009h6.226v35.908h.236l15.903-19.07h6.933l-12.479 14.527l14.267 21.663h-6.932l-10.912-17.47l-6.933 7.902v9.528h-6.225z"/><path fill="#149cb5" d="M202.977 262.556c-.063-2.776.4-5.538 1.363-8.144a19 19 0 0 1 3.705-6.053a16 16 0 0 1 5.246-3.8a14.85 14.85 0 0 1 6.118-1.357a15.4 15.4 0 0 1 6.226 1.208a12.15 12.15 0 0 1 4.605 3.46a15.9 15.9 0 0 1 2.834 5.43a23.8 23.8 0 0 1 .981 7.07a21 21 0 0 1-.231 3.38h-24.689a14.5 14.5 0 0 0 3.666 9.406a11.28 11.28 0 0 0 8.57 3.46c1.659.02 3.309-.247 4.877-.787a21.6 21.6 0 0 0 4.265-2.063l2.193 4.072a31.4 31.4 0 0 1-5.368 2.633a18.7 18.7 0 0 1-6.717 1.126a18 18 0 0 1-6.908-1.357a16.35 16.35 0 0 1-5.586-3.76a17.4 17.4 0 0 1-3.733-5.985a22.3 22.3 0 0 1-1.417-7.94m25.683-2.783q0-5.646-2.385-8.618a8.08 8.08 0 0 0-6.69-2.972a9.1 9.1 0 0 0-3.733.787a10.4 10.4 0 0 0-3.215 2.253a12 12 0 0 0-2.384 3.61a16.6 16.6 0 0 0-1.24 4.927zm7.24-15.748h5.099l.527 6.475h.23a16.6 16.6 0 0 1 4.532-5.307a9.5 9.5 0 0 1 5.816-1.99a9.9 9.9 0 0 1 3.896.73l-1.204 5.307a15 15 0 0 0-1.65-.438c-.62-.107-1.25-.156-1.88-.146a8.2 8.2 0 0 0-4.843 1.844a14.6 14.6 0 0 0-4.383 6.396v22.876h-6.154z"/></svg>

How to use the Spinnaker icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Spinnaker icon in other icon sets

Spinnaker icon FAQ

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

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

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

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

Browse all SVG Logos icons →