Gherkin Light icon

skill-icons:gherkin-light

The Gherkin Light icon (skill-icons:gherkin-light) is a free SVG icon from the Skill Icons set by tandpfun. It is drawn on a 256 × 256 grid. Skill 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: Skill Icons
Author: tandpfun
License: MIT
Size: 256 × 256
Tags: gherkinlight

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#f4f2ed" rx="60"/><path fill="#23d96c" fill-rule="evenodd" d="M173.388 40.316a75 75 0 0 0-4.932-2.658c-1.717-.825-3.486-1.629-5.28-2.327a62 62 0 0 0-1.697-.663c-1.567-.576-3.146-1.202-4.764-1.666a91.1 91.1 0 0 0-35.91-3.957a90.7 90.7 0 0 0-34.567 10.292c-10.682 5.7-20.056 13.476-27.543 22.85c-7.487 9.373-12.93 20.145-15.991 31.65a85.1 85.1 0 0 0-1.811 35.251a85.8 85.8 0 0 0 12.667 33.056c6.489 10.058 15.018 18.712 25.063 25.427a90.3 90.3 0 0 0 33.338 13.62v24.932c53.363-7.861 100.617-49.23 104.138-103.545c2.122-32.68-14.565-66.045-42.711-82.262" clip-rule="evenodd"/><path fill="#173647" d="M107.156 231.583v-26.601c-22.39-5.212-42.043-18.272-55.225-36.701s-18.978-40.944-16.286-63.271s13.684-42.91 30.89-57.844C83.74 32.233 105.962 23.99 128.98 24a95.1 95.1 0 0 1 29.235 4.552c1.26.357 2.57.845 3.836 1.317l1.101.407c.753.288 1.32.504 1.898.744c1.588.616 3.374 1.4 5.523 2.433a79 79 0 0 1 5.271 2.839c29.22 16.838 47.318 51.631 45.049 86.589c-3.492 53.793-48.995 99.163-108.221 107.886zm21.945-198.2h-.115c-20.97-.006-41.189 7.618-56.714 21.385s-25.24 32.69-27.252 53.075s3.825 40.773 16.373 57.182c12.547 16.409 30.904 27.664 51.489 31.568l3.881.741v23.22c52.062-9.968 91.447-50.527 94.543-98.267c2.045-31.524-14.167-62.841-40.358-77.924l-.042-.028a78 78 0 0 0-4.611-2.485c-1.88-.9-3.444-1.594-4.89-2.154c-.59-.245-1.077-.43-1.573-.616l-1.201-.445c-1.14-.423-2.22-.827-3.262-1.124a85.7 85.7 0 0 0-26.268-4.13z"/><path fill="#173647" fill-rule="evenodd" d="M111.176 71.585a8.4 8.4 0 0 1 3.965.475a8.2 8.2 0 0 1 3.269 2.24a18.5 18.5 0 0 1 3.326 4.94c2.952 6.343 4.694 15.449 1.049 20.554a29.2 29.2 0 0 1-10.561-5.044a28.4 28.4 0 0 1-7.632-8.732a14.2 14.2 0 0 1-1.589-5.979a8.64 8.64 0 0 1 2.437-5.748a9.03 9.03 0 0 1 5.736-2.706M89.749 93.242q.737-.06 1.475 0c2.274.038 4.515.529 6.588 1.441c6.558 2.744 13.872 9.452 15.289 15.402c-5.626 3.661-15.759 3.361-22.32.617a35.5 35.5 0 0 1-5.563-3.289a7.9 7.9 0 0 1-2.824-3.882a7.7 7.7 0 0 1-.02-4.762a7.9 7.9 0 0 1 2.791-3.904a8.2 8.2 0 0 1 4.584-1.623m8.047 45.764a15.4 15.4 0 0 1-6.587 1.441a8.47 8.47 0 0 1-5.077-1.009a8.18 8.18 0 0 1-3.477-3.752a7.94 7.94 0 0 1-.523-5.035a8.07 8.07 0 0 1 2.633-4.357a16.1 16.1 0 0 1 5.567-3.295a20.6 20.6 0 0 1 7.615-1.571c4.265-.075 11.587-1.004 15.138 1.305c-.939 5.939-8.73 13.529-15.289 16.273m27.033 14.731a33 33 0 0 1-3.216 5.437c-4.687 5.949-15.552 1.772-15.086-6.011a13.5 13.5 0 0 1 1.476-5.86c2.81-6.408 10.454-14.278 17.015-15.65c3.743 5.491 2.624 16.137-.189 22.084m11.479-74.649a33 33 0 0 1 3.226-5.437a8.4 8.4 0 0 1 3.294-2.324a8.56 8.56 0 0 1 4.026-.536a8.84 8.84 0 0 1 5.896 2.751a8.44 8.44 0 0 1 2.303 5.972a14.2 14.2 0 0 1-1.476 6.01a26.6 26.6 0 0 1-6.896 8.829a27.35 27.35 0 0 1-9.992 5.297c-4.206-5.025-3.191-14.157-.381-20.562m4.103 80.089a18.5 18.5 0 0 1-3.22-5.008c-2.81-6.405-2.713-15.993 1.033-21.029c6.558 1.375 13.432 8.187 16.233 14.595a14.2 14.2 0 0 1 1.476 6.005c.469 6.863-10.371 10.928-15.522 5.437m28.7-19.167a17.1 17.1 0 0 1-6.588-1.442c-6.558-2.744-13.748-9.161-15.153-15.111c3.603-2.306 10.256-2.557 14.568-2.479c2.619.04 5.205.575 7.616 1.577a34.3 34.3 0 0 1 5.56 3.142c6.559 4.589 2.433 14.768-6.003 14.313" clip-rule="evenodd"/></g></svg>

How to use the Gherkin Light icon

React

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

<Icon icon="skill-icons:gherkin-light" width="24" />

Vue

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

<template>
  <Icon icon="skill-icons:gherkin-light" width="24" />
</template>

Svelte

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

<Icon icon="skill-icons:gherkin-light" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[skill-icons--gherkin-light]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/skill-icons -->
<div class="i-skill-icons:gherkin-light"></div>

Web component

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

<iconify-icon icon="skill-icons:gherkin-light"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/skill-icons/gherkin-light.svg" alt="Gherkin Light icon" width="24" height="24">

Related icons in Skill Icons

Gherkin Light icon FAQ

Is the Gherkin Light icon free for commercial use?

Yes. Skill Icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Gherkin Light icon in React?

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

How do I add the Gherkin Light icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/skill-icons/gherkin-light.svg" alt="Gherkin Light icon">, or paste the SVG code inline to style it with CSS.

Browse all Skill Icons →