Trader Joes icon
cbi:trader-joes
The Trader Joes icon (cbi:trader-joes) is a free SVG icon from the Custom Brand Icons set by Emanuele & rchiileea. It is drawn on a 24 × 24 grid. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Custom Brand Icons
- Author
- Emanuele & rchiileea
- License
- CC-BY-NC-SA-4.0
- Size
- 24 × 24
- Tags
- traderjoes, joe
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M18.58 7.675c0 .19.682.474.547 2.11c0 0-.203 1.366-.547 1.71h1.568c-.338-.412-.541-1.575-.27-1.71c0 0 .209-.135.344.068c0 0 .234.19.345.48c.27.682.067 1.045.067 1.162H22c-.012-.19-.345-.473-.615-.953a4.5 4.5 0 0 1-.412-1.095s.553-.419.615-.886c.055-.382-.142-.818-.412-.886Zm1.333.54c.155-.004.774.019.715.617c-.024.289-.615.547-.75.547c0 0 .067-.283.067-.547c0-.24-.067-.616-.067-.616Zm-7.787-.54c.012.43.615.954.48 2.184c-.11.984-.412 1.643-.412 1.643c.437 0 1.31.043 1.778 0c.75-.068 1.378-.966 1.365-1.981c-.006-.843-.682-1.643-1.298-1.846Zm1.224.701s.997.302 1.028 1.028c.024.781-.615.96-.818 1.027c0 0 0 .269-.204-.615c-.135-.567-.006-1.44-.006-1.44m-3.93-.701c0 .086.135.345-.136 1.23c-.258.862-.886 2.473-.886 2.597h1.298c-.018-.222-.277-1.164.27-1.299c.118-.03.4-.073.548.135c.24.338.412 1.101.412 1.164h1.268l.015-.035c-.108-.226-.727-1.537-1.086-2.563c-.209-.615-.11-1.156-.135-1.23Zm.756.954c.27 1.026.615 1.095.48 1.095H9.77s.19-.32.27-.548c.075-.209.136-.547.136-.547m-4.952-.954c0 .19.683.474.547 2.11c0 0-.203 1.366-.547 1.71h1.568c-.338-.412-.541-1.575-.27-1.71c0 0 .209-.135.344.068c0 0 .234.19.345.48c.27.682.067 1.045.067 1.162h1.12a2 2 0 0 1 .09-.296c-.124-.166-.302-.378-.46-.657a4.6 4.6 0 0 1-.411-1.095s.553-.419.615-.886c.055-.382-.142-.818-.412-.886Zm1.333.54c.155-.004.775.019.715.617c-.024.289-.615.547-.75.547c0 0 .067-.283.067-.547c0-.24-.067-.616-.067-.616Zm8.86-.54c0 .092.413 1.113.413 2.049c0 .873-.413 1.673-.413 1.778h2.664l.265-1.366c-.332.012-1.09.547-1.569.615c-.449.062-.357-.763-.27-.96c.086-.19.75.068.818.068v-.75c-1.059.264-1.132-.253-.683-.683c.246-.24 1.458.473 1.71.48l-.27-1.231Zm-12.734 0L2 9.379c.338-.27.48-.48.75-.683c0 0 .216-.117.345-.067c.142.061.203.344.203.344c.068.269-.068 1.298-.615 2.528h1.98c-.479-1.365-.823-2.596-.344-2.866c0 0 .203-.074.345.067c.135.136.418.492.683.683l-.616-1.71Zm7.557 4.75c-.91 0-1.642.874-1.642 1.95s.732 1.945 1.642 1.951c.91 0 1.643-.874 1.643-1.95s-.738-1.95-1.643-1.95m-.209 1.163a.818.818 0 1 1 0 1.637a.81.81 0 0 1-.818-.818c0-.456.37-.819.818-.819M6.58 12.426c.412.276 1.366 1.574.554 2.596c-.253.326-1.366-.068-.548-.818c-.21.067-1.44.738-1.642.818c0 0 .547.135.75.48c.154.258.295.486.48.615c.32.227.781.24 1.095.067c.634-.356.923-.769.886-1.71c-.068-1.636.886-1.993.886-2.048Zm5.321 0c0 .092.413 1.113.413 2.048c0 .874-.413 1.674-.413 1.778h2.664l.265-1.366c-.332.013-1.09.548-1.569.616c-.45.061-.357-.763-.27-.961c.085-.19.75.068.818.068v-.751c-1.059.265-1.132-.252-.683-.683c.246-.24 1.458.474 1.71.48l-.27-1.23Zm3.459-.262a.44.44 0 0 0-.247.07c-.616.48.27 1.096.27 1.096l-.135.547s1.052-.965.683-1.44a.7.7 0 0 0-.571-.273m2.203.222c-.307.002-.626.05-.875.2c-.314.19-.579.584-.566.96c.024.473.172.688.295.811c.406.413.48.202.818.616c.222.269-.135.547-.338.547c-.45 0-.53-.812-.615-.818l-.548 1.569c.203.086.48-.068.615-.136c.48.068.345.136 1.163.136c.75 0 1.23-.185 1.23-1.095c0-.683-.547-1.096-.885-1.163c-.48-.093-.616-.48-.48-.75c.086-.155.289-.204.547-.204c.345 0 .437.16.48.202a.97.97 0 0 1 .203.616l.75-1.433c-.135-.055-.615.202-.75.067c-.058 0-.534-.128-1.044-.125"/></svg>How to use the Trader Joes icon
React
import { Icon } from "@iconify/react";
<Icon icon="cbi:trader-joes" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="cbi:trader-joes" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="cbi:trader-joes" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[cbi--trader-joes]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/cbi -->
<div class="i-cbi:trader-joes"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="cbi:trader-joes"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/cbi/trader-joes.svg" alt="Trader Joes icon" width="24" height="24">Trader Joes icon FAQ
Is the Trader Joes icon free for commercial use?
No. Custom Brand Icons use the CC BY-NC-SA 4.0 license, which does not allow commercial use without separate permission from the author.
How do I use the Trader Joes icon in React?
Install @iconify/react and render <Icon icon="cbi:trader-joes" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Trader Joes icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/cbi/trader-joes.svg" alt="Trader Joes icon">, or paste the SVG code inline to style it with CSS.