react logo
react-dark from Skill Icons by tandpfun · Dark · MIT Free for personal and commercial use.
- Name
- react-dark
- Set
- Skill Icons
- Style
- Dark
- Viewbox
- 256×256
- License
- MIT
1 other variant in Skill Icons
The same logo in other sets
react-fillAkar IconsreactBoxicons BrandsreactCoreUI BrandsreactDeviconreactFont Awesome 6 BrandsreactFont Awesome Brandsreact-solidFlowbite IconsreactHuge IconsreactLine AwesomereactSVG LogosreactMaterial Icon ThemereactMaterial Design Iconsreact-fillMingCute IconreactPixelarticonsreactSimple Iconsreact-outlineTeenyiconsreactUniconsreactUnicons Monochrome
Use the react 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="#00d8ff" d="M128.001 146.951c10.304 0 18.656-8.353 18.656-18.656s-8.352-18.656-18.656-18.656s-18.656 8.353-18.656 18.656s8.353 18.656 18.656 18.656"/><path stroke="#00d8ff" stroke-width="8.911" d="M128.002 90.363c25.048 0 48.317 3.594 65.862 9.635C215.003 107.275 228 118.306 228 128.295c0 10.409-13.774 22.128-36.475 29.649c-17.162 5.686-39.746 8.654-63.523 8.654c-24.378 0-47.463-2.786-64.819-8.717C41.225 150.376 28 138.506 28 128.295c0-9.908 12.41-20.854 33.252-28.12c17.61-6.14 41.453-9.812 66.746-9.812z" clip-rule="evenodd"/><path stroke="#00d8ff" stroke-width="8.911" d="M94.981 109.438c12.514-21.698 27.251-40.06 41.249-52.24c16.864-14.677 32.914-20.425 41.566-15.436c9.017 5.2 12.288 22.988 7.463 46.41c-3.645 17.707-12.359 38.753-24.238 59.351c-12.179 21.118-26.124 39.724-39.931 51.792c-17.471 15.272-34.362 20.799-43.207 15.698c-8.583-4.946-11.865-21.167-7.747-42.852c3.479-18.323 12.21-40.812 24.841-62.723z" clip-rule="evenodd"/><path stroke="#00d8ff" stroke-width="8.911" d="M95.012 147.578c-12.549-21.674-21.093-43.616-24.659-61.826c-4.293-21.941-1.258-38.716 7.387-43.72c9.009-5.216 26.052.834 43.934 16.712c13.52 12.004 27.403 30.061 39.316 50.639c12.214 21.098 21.368 42.473 24.929 60.461c4.506 22.764.859 40.157-7.978 45.272c-8.574 4.964-24.265-.291-40.996-14.689c-14.136-12.164-29.26-30.959-41.933-52.849Z" clip-rule="evenodd"/></g></svg>
React
import type { SVGProps } from "react";
export function SkillIconsReactDark(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="#00d8ff" d="M128.001 146.951c10.304 0 18.656-8.353 18.656-18.656s-8.352-18.656-18.656-18.656s-18.656 8.353-18.656 18.656s8.353 18.656 18.656 18.656"/><path stroke="#00d8ff" strokeWidth="8.911" d="M128.002 90.363c25.048 0 48.317 3.594 65.862 9.635C215.003 107.275 228 118.306 228 128.295c0 10.409-13.774 22.128-36.475 29.649c-17.162 5.686-39.746 8.654-63.523 8.654c-24.378 0-47.463-2.786-64.819-8.717C41.225 150.376 28 138.506 28 128.295c0-9.908 12.41-20.854 33.252-28.12c17.61-6.14 41.453-9.812 66.746-9.812z" clipRule="evenodd"/><path stroke="#00d8ff" strokeWidth="8.911" d="M94.981 109.438c12.514-21.698 27.251-40.06 41.249-52.24c16.864-14.677 32.914-20.425 41.566-15.436c9.017 5.2 12.288 22.988 7.463 46.41c-3.645 17.707-12.359 38.753-24.238 59.351c-12.179 21.118-26.124 39.724-39.931 51.792c-17.471 15.272-34.362 20.799-43.207 15.698c-8.583-4.946-11.865-21.167-7.747-42.852c3.479-18.323 12.21-40.812 24.841-62.723z" clipRule="evenodd"/><path stroke="#00d8ff" strokeWidth="8.911" d="M95.012 147.578c-12.549-21.674-21.093-43.616-24.659-61.826c-4.293-21.941-1.258-38.716 7.387-43.72c9.009-5.216 26.052.834 43.934 16.712c13.52 12.004 27.403 30.061 39.316 50.639c12.214 21.098 21.368 42.473 24.929 60.461c4.506 22.764.859 40.157-7.978 45.272c-8.574 4.964-24.265-.291-40.996-14.689c-14.136-12.164-29.26-30.959-41.933-52.849Z" clipRule="evenodd"/></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="#00d8ff" d="M128.001 146.951c10.304 0 18.656-8.353 18.656-18.656s-8.352-18.656-18.656-18.656s-18.656 8.353-18.656 18.656s8.353 18.656 18.656 18.656"/><path stroke="#00d8ff" stroke-width="8.911" d="M128.002 90.363c25.048 0 48.317 3.594 65.862 9.635C215.003 107.275 228 118.306 228 128.295c0 10.409-13.774 22.128-36.475 29.649c-17.162 5.686-39.746 8.654-63.523 8.654c-24.378 0-47.463-2.786-64.819-8.717C41.225 150.376 28 138.506 28 128.295c0-9.908 12.41-20.854 33.252-28.12c17.61-6.14 41.453-9.812 66.746-9.812z" clip-rule="evenodd"/><path stroke="#00d8ff" stroke-width="8.911" d="M94.981 109.438c12.514-21.698 27.251-40.06 41.249-52.24c16.864-14.677 32.914-20.425 41.566-15.436c9.017 5.2 12.288 22.988 7.463 46.41c-3.645 17.707-12.359 38.753-24.238 59.351c-12.179 21.118-26.124 39.724-39.931 51.792c-17.471 15.272-34.362 20.799-43.207 15.698c-8.583-4.946-11.865-21.167-7.747-42.852c3.479-18.323 12.21-40.812 24.841-62.723z" clip-rule="evenodd"/><path stroke="#00d8ff" stroke-width="8.911" d="M95.012 147.578c-12.549-21.674-21.093-43.616-24.659-61.826c-4.293-21.941-1.258-38.716 7.387-43.72c9.009-5.216 26.052.834 43.934 16.712c13.52 12.004 27.403 30.061 39.316 50.639c12.214 21.098 21.368 42.473 24.929 60.461c4.506 22.764.859 40.157-7.978 45.272c-8.574 4.964-24.265-.291-40.996-14.689c-14.136-12.164-29.26-30.959-41.933-52.849Z" clip-rule="evenodd"/></g></svg> </template>
CSS
.icon-react-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%22%2300d8ff%22%20d%3D%22M128.001%20146.951c10.304%200%2018.656-8.353%2018.656-18.656s-8.352-18.656-18.656-18.656s-18.656%208.353-18.656%2018.656s8.353%2018.656%2018.656%2018.656%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M128.002%2090.363c25.048%200%2048.317%203.594%2065.862%209.635C215.003%20107.275%20228%20118.306%20228%20128.295c0%2010.409-13.774%2022.128-36.475%2029.649c-17.162%205.686-39.746%208.654-63.523%208.654c-24.378%200-47.463-2.786-64.819-8.717C41.225%20150.376%2028%20138.506%2028%20128.295c0-9.908%2012.41-20.854%2033.252-28.12c17.61-6.14%2041.453-9.812%2066.746-9.812z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M94.981%20109.438c12.514-21.698%2027.251-40.06%2041.249-52.24c16.864-14.677%2032.914-20.425%2041.566-15.436c9.017%205.2%2012.288%2022.988%207.463%2046.41c-3.645%2017.707-12.359%2038.753-24.238%2059.351c-12.179%2021.118-26.124%2039.724-39.931%2051.792c-17.471%2015.272-34.362%2020.799-43.207%2015.698c-8.583-4.946-11.865-21.167-7.747-42.852c3.479-18.323%2012.21-40.812%2024.841-62.723z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M95.012%20147.578c-12.549-21.674-21.093-43.616-24.659-61.826c-4.293-21.941-1.258-38.716%207.387-43.72c9.009-5.216%2026.052.834%2043.934%2016.712c13.52%2012.004%2027.403%2030.061%2039.316%2050.639c12.214%2021.098%2021.368%2042.473%2024.929%2060.461c4.506%2022.764.859%2040.157-7.978%2045.272c-8.574%204.964-24.265-.291-40.996-14.689c-14.136-12.164-29.26-30.959-41.933-52.849Z%22%20clip-rule%3D%22evenodd%22%2F%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%22%2300d8ff%22%20d%3D%22M128.001%20146.951c10.304%200%2018.656-8.353%2018.656-18.656s-8.352-18.656-18.656-18.656s-18.656%208.353-18.656%2018.656s8.353%2018.656%2018.656%2018.656%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M128.002%2090.363c25.048%200%2048.317%203.594%2065.862%209.635C215.003%20107.275%20228%20118.306%20228%20128.295c0%2010.409-13.774%2022.128-36.475%2029.649c-17.162%205.686-39.746%208.654-63.523%208.654c-24.378%200-47.463-2.786-64.819-8.717C41.225%20150.376%2028%20138.506%2028%20128.295c0-9.908%2012.41-20.854%2033.252-28.12c17.61-6.14%2041.453-9.812%2066.746-9.812z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M94.981%20109.438c12.514-21.698%2027.251-40.06%2041.249-52.24c16.864-14.677%2032.914-20.425%2041.566-15.436c9.017%205.2%2012.288%2022.988%207.463%2046.41c-3.645%2017.707-12.359%2038.753-24.238%2059.351c-12.179%2021.118-26.124%2039.724-39.931%2051.792c-17.471%2015.272-34.362%2020.799-43.207%2015.698c-8.583-4.946-11.865-21.167-7.747-42.852c3.479-18.323%2012.21-40.812%2024.841-62.723z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20stroke%3D%22%2300d8ff%22%20stroke-width%3D%228.911%22%20d%3D%22M95.012%20147.578c-12.549-21.674-21.093-43.616-24.659-61.826c-4.293-21.941-1.258-38.716%207.387-43.72c9.009-5.216%2026.052.834%2043.934%2016.712c13.52%2012.004%2027.403%2030.061%2039.316%2050.639c12.214%2021.098%2021.368%2042.473%2024.929%2060.461c4.506%2022.764.859%2040.157-7.978%2045.272c-8.574%204.964-24.265-.291-40.996-14.689c-14.136-12.164-29.26-30.959-41.933-52.849Z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/skill-icons/react-dark.svg?color=%231a73e8&size=48
