Rider icon
logos:rider
The Rider icon (logos:rider) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 256 × 256 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 × 256
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><defs><linearGradient id="SVGxD1wR08k" x1="90.832%" x2="-19.123%" y1="81.803%" y2="19.04%"><stop offset="0%" stop-color="#dd1265"/><stop offset="48%" stop-color="#dd1265"/><stop offset="94%" stop-color="#fdb60d"/></linearGradient><linearGradient id="SVGd4VpRdPz" x1="35.983%" x2="53.7%" y1="7.271%" y2="92.994%"><stop offset="14%" stop-color="#087cfa"/><stop offset="48%" stop-color="#dd1265"/><stop offset="96%" stop-color="#087cfa"/></linearGradient><linearGradient id="SVGRbH9nbrm" x1="39.545%" x2="56.938%" y1="11.352%" y2="91.694%"><stop offset="28%" stop-color="#dd1265"/><stop offset="97%" stop-color="#fdb60d"/></linearGradient></defs><path fill="url(#SVGxD1wR08k)" d="M256 99.6L76.533 0l120.16 178.533l24.694-16.186z"/><path fill="url(#SVGd4VpRdPz)" d="m184.4 58.987l-22.48-54.96l-49.733 48.96l20.346 177.653L180.72 256L256 212.027z"/><path fill="url(#SVGRbH9nbrm)" d="M76.533 0L0 51.547L28.453 227.36l73.387 28.213l94.853-77.04z"/><path d="M48 48.32h160v160H48z"/><path fill="#fff" d="M67.947 178.08h60v10h-60zM68 68.107h27.467a24 24 0 0 1 17.52 6.106a18.88 18.88 0 0 1 5.188 12.957l-.015.963a18.67 18.67 0 0 1-12.907 18.667l14.72 21.493H104.48L91.6 109.04H81.333v19.253H68zM94.667 97.44c6.238 0 9.91-3.214 10.147-8.005l.013-.662c0-5.68-3.947-8.613-10.4-8.613H81.333v17.28zm34.48-29.333h23.466c18.616 0 31.596 12.59 31.991 29.141l.01.965c0 16.934-13.067 30.08-32 30.08h-23.467zm13.333 11.946v36.267h10.24a17.147 17.147 0 0 0 18.155-17.206l-.022-.927a17.307 17.307 0 0 0-18.133-18.16z"/></svg>How to use the Rider icon
React
import { Icon } from "@iconify/react";
<Icon icon="logos:rider" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="logos:rider" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="logos:rider" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--rider]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:rider"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="logos:rider"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/logos/rider.svg" alt="Rider icon" width="24" height="24">Rider icon in other icon sets
Rider icon FAQ
Is the Rider 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 Rider icon in React?
Install @iconify/react and render <Icon icon="logos:rider" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Rider icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/rider.svg" alt="Rider icon">, or paste the SVG code inline to style it with CSS.