Trailbase icon
thesvg-color:trailbase
The Trailbase icon (thesvg-color:trailbase) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 135 × 135 grid. theSVG Color 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
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 135 × 135
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="135" height="135" viewBox="0 0 135 135"><defs><clipPath id="SVGeW1PteTn" clipPathUnits="userSpaceOnUse"><use href="#SVGxTWPYdyP" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="40" stroke-width="1.852"/></clipPath><clipPath id="SVGYPTvAduz" clipPathUnits="userSpaceOnUse"><circle cx="420.855" cy="71.167" r="57.454" fill="#0273aa" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="40" stroke-width="2.132" transform="scale(-1 1)"/></clipPath><path id="SVGxTWPYdyP" fill="#0273aa" d="M-432.003 67.319c-1.736.14-3.501.246-4.397.178c-1.811-4.111 1.52-8.953 4.45-8.846c6.202.226 4.327 8.329-.053 8.668"/></defs><g stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="40" stroke-width=".5" clip-path="url(#SVGYPTvAduz)" transform="translate(563.884 -16.167)scale(1.17891)"><circle cx="420.855" cy="71.167" r="57.454" fill="#0073aa" transform="scale(-1 1)"/><g clip-path="none"><path fill="#e6e6e6" d="M-394.37 131.478c5.12-4.344 11.676-7.387 14.741-13.661c7.513-10.787 9.937-23.024 7.086-35.022c-3.593-12.873-10.702-24.576-20.054-34.075c-6.5-8.653-17.65-20.955-5.008-28.104c-6.307-4.056-18.756-4.638-25.704-1.75c-15.258 5.96-26.033 19.154-31.666 33.954c-3.25 8.539-.754 16.124-1.77 25.047c-.356 4.145 17.32 8.984 17.654 13.108c13.497 14.623 15.845 37.512 36.898 39.29z"/><path fill="#fff" d="M-404.673 53.966c-15.126-12.03-8.875-28.361 7.068-33.35c-6.307-4.056-18.756-4.638-25.704-1.75c-15.258 5.96-26.033 19.154-31.666 33.954c-3.25 8.539-.754 16.124-1.77 25.047c-.356 4.145 17.32 8.984 17.654 13.108c26.57-16.774 21.843-.326 34.418-37.01"/><path fill="#0073aa" d="M-457.727 69.432c3.39-13.265 8.173-20.648 18.283-28.818c2.543-3.757 5.893-9.338 8.312-10.306c2.743 1.237 3.71 3.928 5.272 6.367l6.125-1.227c1.636-5.26 3.122-8.448 7.62-10.655c6.272 4.106 10.787 9.442 8.74 18.139c13.099 13.464 16.443 20.397 24.604 39.659c.493 9.347-.278 21.544-1.47 29.794c0 0-1.693 6.259-2.477 5.724c-.785-.534-4.765-5.187-4.765-5.187l-14.107-45.691l-26.404-16.864s-13.847 5.578-14.887 5.947s-13.534 18.76-13.534 18.76z"/><path fill="#fff" d="M-384.876 121.377c3.755-12.905 3.799-25.679 3.46-38.415c-3.686-9.016-6.906-16.257-11.007-22.767c-33.448 11.59-41.51 10.306-48.192 20.24c-.98 7.932-6.135 12.228-.805 12.978c-3.94 6.716-7.955 17.147-7.099 28.87c4.525 2.432 9.626 4.762 14.501 6.382c4.021 1.037 8.176 1.379 12.379 1.366c3.838.31 7.68.824 11.51.152c4.552-.17 8.858-1.8 13.22-2.948c2.984-1.368 4.011-1.566 6.994-2.933z"/><path fill="#e6e6e6" d="M-396.08 90.674c-.011-2.186-.31-3.658.735-8.453c-.563-1.566-1.374-3.117-4.377-4.129l-27.887-5.756l-13.815 21.085c-.374.632-1.56 2.736-2.324 4.495l7.333 2.008l3.05 16.392c-1.018 5.79-1.712 11.201 1.852 14.827l35.362 2.992c-.427-3.209-4.128-11.83-2.52-19.803z"/><path fill="#fff" d="M-389.175 65.82c-4.295-8.089-9.266-14.814-16.998-21.788c2.539-7.6-.907-11.837-5.96-15.959c-3.967 2.764-4.355 5.264-5.514 9.534l-10.077 1.876c-.607-1.466-1.697-5.474-3.587-5.948c-2.695 2.293-3.627 7.287-9.063 11.064c-10.719 8.957-16.276 23.967-17.447 36.4c-.604 3.594 1.284 5.084 2.174 7.085c4.005 4.344 8.874 4.771 14.227 5.329c12.387 1.29 47.914-12.996 52.245-27.592"/><use href="#SVGxTWPYdyP"/><circle cx="-435.367" cy="65.692" r="2.15" fill="#fff" clip-path="url(#SVGeW1PteTn)"/><path fill="#0273aa" d="M-412.33 46.837c3.388-4.79 4.278-5.678 3.534-11.123c-1.287-2.525-3.56-.01-3.578.374c-.08.268.626 5.692.044 10.749"/><path fill="#e6e6e6" d="M-439.131 43.584c3.723-1.615 7.367-3.484 11.415-4.049l-1.361-3.617c-.802-1.39-1.755-2.491-2.277-2.367c-.077.018-.199.06-1.035 1.146c-1.088 1.412-2.195 3.572-3.522 5.398c-1.469 2.02-2.986 3.502-3.22 3.489m33.043.525l-3.382 5.263l6.116-2.68z"/><g fill="#0073aa"><path d="M-457.876 83.18s-1.176 2.935 1.464 5.058c4.106-3.375 4.34-6.079 4-6.604c-.62-.007-3.502.756-5.464 1.546"/><path d="M-454.563 85.363c.188 1.166 1.143 2.898 2.73 3.885c-.032.218-.863.71-.863.71s-2.317-1.088-3.145-3.036"/></g><path fill="#0273aa" d="M-398.8 114.344c2.149-3.189 5.329-9.005 6.862-16.236c-1.688-8.453-5.414-9.529-12.672-13.175l-6.776-2.165c-.595-4.917 3.663-6.008 1.958-7.563c-.61-.608-.858-1.152-2.928-.747c-.69 2.828-1.59 4.882-1.384 7.856c-10.883-.324-19.868 1.216-23.756 10.918l.595 6.157a548 548 0 0 0 1.196 10.719c2.51 9.537 7.276 12.849 15.15 17.947c10.806-1.604 18.018-8.233 21.756-13.711"/><path fill="#01557e" d="M-437.25 95.941c15.471 5.161 28.854 6.211 44.45 5.529l-.332 1.001c-2.844 8.49-7.114 16.2-14.78 20.773c-4.224 2.876-8.96 4.243-12.642 4.806c4.902-1.941 6.282-3.13 9.442-5.621c7.303-5.758 10.538-13.792-7.264-17.547c-2.048-.754-6.97-1.795-8.957-2.484c-3.787-1.313-5.874-2.696-8.495-4.2c-.648-.555-1.05-1.499-1.421-2.257m24.864-21.401c1.047 1.026 2.038 1.538 3.328 1.218c.066.21.023.419-.032.627c-1.534 2.41-2.454 4.553-2.214 7.285l.161 1.056c-.936.098-1.876.258-2.453-.468c.75.18.902.014 1.424-.486c-.175-2.662.303-4.512 1.492-6.77c-.345-1.052-1.02-1.565-1.706-2.462"/><path fill="#fff" d="M-425.346 106.897c-4.285-3.14-8.227-6.286-13.564-7.799l-2.744-.631l-1.542 5.908l3.471 4.956c4.235-.081 11.402 1.606 14.77-.716c.833-.457.276-1.182-.39-1.718m29.681 7.722c-3.66-.57-7.76-.936-11.111-1.776c-2.188-.932-3.006-2.359-1.709-3.719c.374-.397 5.696-2.258 8.589-3.253c2.852-1.186 5.574-2.652 8.325-4.05l3.677-2.615l2.492 6.808l-2.297 7.917l-3.925 1.477z"/></g></g></svg>How to use the Trailbase icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:trailbase" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:trailbase" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:trailbase" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--trailbase]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:trailbase"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:trailbase"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/trailbase.svg" alt="Trailbase icon" width="24" height="24">Trailbase icon FAQ
Is the Trailbase icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Trailbase icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:trailbase" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Trailbase icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/trailbase.svg" alt="Trailbase icon">, or paste the SVG code inline to style it with CSS.