vite-dark from Skill Icons by tandpfun · Dark · MIT Free for personal and commercial use.

Name
vite-dark
Set
Skill Icons
Style
Dark
Viewbox
256×256
License
MIT

1 other variant in Skill Icons

The same logo in other sets

Use the vite logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#242938" rx="60"/><path fill="url(#SVGO6JBKe3v)" d="m227.088 57.602l-93.832 167.787c-1.938 3.465-6.915 3.485-8.881.038L28.682 57.617c-2.142-3.756 1.07-8.306 5.328-7.545l93.932 16.79a5.1 5.1 0 0 0 1.812-.004l91.968-16.763c4.243-.773 7.47 3.742 5.366 7.507"/><path fill="url(#SVGHms0bd8n)" d="m172.687 28.05l-69.438 13.605a2.55 2.55 0 0 0-2.055 2.352l-4.272 72.141a2.55 2.55 0 0 0 3.118 2.635l19.333-4.461c1.809-.417 3.443 1.176 3.072 2.995l-5.744 28.126c-.387 1.893 1.391 3.511 3.239 2.95l11.941-3.628c1.851-.562 3.63 1.061 3.238 2.956l-9.128 44.179c-.571 2.764 3.105 4.271 4.638 1.901l1.024-1.582l56.582-112.92c.948-1.89-.686-4.046-2.763-3.646l-19.899 3.841c-1.87.36-3.461-1.381-2.934-3.21l12.989-45.026c.528-1.832-1.069-3.575-2.941-3.209"/><defs><linearGradient id="SVGO6JBKe3v" x1="26.346" x2="143.127" y1="44.075" y2="202.673" gradientUnits="userSpaceOnUse"><stop stop-color="#41d1ff"/><stop offset="1" stop-color="#bd34fe"/></linearGradient><linearGradient id="SVGHms0bd8n" x1="122.551" x2="143.676" y1="31.743" y2="176.66" gradientUnits="userSpaceOnUse"><stop stop-color="#ffea83"/><stop offset=".083" stop-color="#ffdd35"/><stop offset="1" stop-color="#ffa800"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function SkillIconsViteDark(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#242938" rx="60"/><path fill="url(#SVGO6JBKe3v)" d="m227.088 57.602l-93.832 167.787c-1.938 3.465-6.915 3.485-8.881.038L28.682 57.617c-2.142-3.756 1.07-8.306 5.328-7.545l93.932 16.79a5.1 5.1 0 0 0 1.812-.004l91.968-16.763c4.243-.773 7.47 3.742 5.366 7.507"/><path fill="url(#SVGHms0bd8n)" d="m172.687 28.05l-69.438 13.605a2.55 2.55 0 0 0-2.055 2.352l-4.272 72.141a2.55 2.55 0 0 0 3.118 2.635l19.333-4.461c1.809-.417 3.443 1.176 3.072 2.995l-5.744 28.126c-.387 1.893 1.391 3.511 3.239 2.95l11.941-3.628c1.851-.562 3.63 1.061 3.238 2.956l-9.128 44.179c-.571 2.764 3.105 4.271 4.638 1.901l1.024-1.582l56.582-112.92c.948-1.89-.686-4.046-2.763-3.646l-19.899 3.841c-1.87.36-3.461-1.381-2.934-3.21l12.989-45.026c.528-1.832-1.069-3.575-2.941-3.209"/><defs><linearGradient id="SVGO6JBKe3v" x1="26.346" x2="143.127" y1="44.075" y2="202.673" gradientUnits="userSpaceOnUse"><stop stopColor="#41d1ff"/><stop offset="1" stopColor="#bd34fe"/></linearGradient><linearGradient id="SVGHms0bd8n" x1="122.551" x2="143.676" y1="31.743" y2="176.66" gradientUnits="userSpaceOnUse"><stop stopColor="#ffea83"/><stop offset=".083" stopColor="#ffdd35"/><stop offset="1" stopColor="#ffa800"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#242938" rx="60"/><path fill="url(#SVGO6JBKe3v)" d="m227.088 57.602l-93.832 167.787c-1.938 3.465-6.915 3.485-8.881.038L28.682 57.617c-2.142-3.756 1.07-8.306 5.328-7.545l93.932 16.79a5.1 5.1 0 0 0 1.812-.004l91.968-16.763c4.243-.773 7.47 3.742 5.366 7.507"/><path fill="url(#SVGHms0bd8n)" d="m172.687 28.05l-69.438 13.605a2.55 2.55 0 0 0-2.055 2.352l-4.272 72.141a2.55 2.55 0 0 0 3.118 2.635l19.333-4.461c1.809-.417 3.443 1.176 3.072 2.995l-5.744 28.126c-.387 1.893 1.391 3.511 3.239 2.95l11.941-3.628c1.851-.562 3.63 1.061 3.238 2.956l-9.128 44.179c-.571 2.764 3.105 4.271 4.638 1.901l1.024-1.582l56.582-112.92c.948-1.89-.686-4.046-2.763-3.646l-19.899 3.841c-1.87.36-3.461-1.381-2.934-3.21l12.989-45.026c.528-1.832-1.069-3.575-2.941-3.209"/><defs><linearGradient id="SVGO6JBKe3v" x1="26.346" x2="143.127" y1="44.075" y2="202.673" gradientUnits="userSpaceOnUse"><stop stop-color="#41d1ff"/><stop offset="1" stop-color="#bd34fe"/></linearGradient><linearGradient id="SVGHms0bd8n" x1="122.551" x2="143.676" y1="31.743" y2="176.66" gradientUnits="userSpaceOnUse"><stop stop-color="#ffea83"/><stop offset=".083" stop-color="#ffdd35"/><stop offset="1" stop-color="#ffa800"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-vite-dark {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cg%20fill%3D%22none%22%3E%3Crect%20width%3D%22256%22%20height%3D%22256%22%20fill%3D%22%23242938%22%20rx%3D%2260%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGO6JBKe3v)%22%20d%3D%22m227.088%2057.602l-93.832%20167.787c-1.938%203.465-6.915%203.485-8.881.038L28.682%2057.617c-2.142-3.756%201.07-8.306%205.328-7.545l93.932%2016.79a5.1%205.1%200%200%200%201.812-.004l91.968-16.763c4.243-.773%207.47%203.742%205.366%207.507%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHms0bd8n)%22%20d%3D%22m172.687%2028.05l-69.438%2013.605a2.55%202.55%200%200%200-2.055%202.352l-4.272%2072.141a2.55%202.55%200%200%200%203.118%202.635l19.333-4.461c1.809-.417%203.443%201.176%203.072%202.995l-5.744%2028.126c-.387%201.893%201.391%203.511%203.239%202.95l11.941-3.628c1.851-.562%203.63%201.061%203.238%202.956l-9.128%2044.179c-.571%202.764%203.105%204.271%204.638%201.901l1.024-1.582l56.582-112.92c.948-1.89-.686-4.046-2.763-3.646l-19.899%203.841c-1.87.36-3.461-1.381-2.934-3.21l12.989-45.026c.528-1.832-1.069-3.575-2.941-3.209%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGO6JBKe3v%22%20x1%3D%2226.346%22%20x2%3D%22143.127%22%20y1%3D%2244.075%22%20y2%3D%22202.673%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2341d1ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23bd34fe%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGHms0bd8n%22%20x1%3D%22122.551%22%20x2%3D%22143.676%22%20y1%3D%2231.743%22%20y2%3D%22176.66%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffea83%22%2F%3E%3Cstop%20offset%3D%22.083%22%20stop-color%3D%22%23ffdd35%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ffa800%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cg%20fill%3D%22none%22%3E%3Crect%20width%3D%22256%22%20height%3D%22256%22%20fill%3D%22%23242938%22%20rx%3D%2260%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGO6JBKe3v)%22%20d%3D%22m227.088%2057.602l-93.832%20167.787c-1.938%203.465-6.915%203.485-8.881.038L28.682%2057.617c-2.142-3.756%201.07-8.306%205.328-7.545l93.932%2016.79a5.1%205.1%200%200%200%201.812-.004l91.968-16.763c4.243-.773%207.47%203.742%205.366%207.507%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGHms0bd8n)%22%20d%3D%22m172.687%2028.05l-69.438%2013.605a2.55%202.55%200%200%200-2.055%202.352l-4.272%2072.141a2.55%202.55%200%200%200%203.118%202.635l19.333-4.461c1.809-.417%203.443%201.176%203.072%202.995l-5.744%2028.126c-.387%201.893%201.391%203.511%203.239%202.95l11.941-3.628c1.851-.562%203.63%201.061%203.238%202.956l-9.128%2044.179c-.571%202.764%203.105%204.271%204.638%201.901l1.024-1.582l56.582-112.92c.948-1.89-.686-4.046-2.763-3.646l-19.899%203.841c-1.87.36-3.461-1.381-2.934-3.21l12.989-45.026c.528-1.832-1.069-3.575-2.941-3.209%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGO6JBKe3v%22%20x1%3D%2226.346%22%20x2%3D%22143.127%22%20y1%3D%2244.075%22%20y2%3D%22202.673%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2341d1ff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23bd34fe%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGHms0bd8n%22%20x1%3D%22122.551%22%20x2%3D%22143.676%22%20y1%3D%2231.743%22%20y2%3D%22176.66%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffea83%22%2F%3E%3Cstop%20offset%3D%22.083%22%20stop-color%3D%22%23ffdd35%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ffa800%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/skill-icons/vite-dark.svg?color=%231a73e8&size=48