Hackerrank icon
Download the Hackerrank logo as free SVG or PNG. Customize its outline stroke. Copy React, Vue or Svelte code.
- hackerrank
- coding
- challenges
- interview
- programming
- practice
- developer
- logo
- brand
- social
Size
Stroke
Color
- Category
- brand
- Styles
- Outline
- Component
- IconBrandHackerrank
- License
- MIT · Paweł Kuna
Code
Copy it the way you use it
brand-hackerrank.svg
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M19.484 5.667c-1.146 -.904 -3.35 -2.394 -6.497 -3.429c-.484 -.159 -.725 -.238 -1.04 -.238c-.314 0 -.556 .08 -1.04 .238c-3.147 1.035 -5.35 2.525 -6.496 3.43c-.402 .317 -.604 .476 -.797 .816c-.194 .341 -.233 .62 -.309 1.178a33 33 0 0 0 -.305 4.338c0 1.742 .165 3.317 .305 4.338c.076 .558 .115 .837 .309 1.178c.193 .34 .395 .5 .797 .817c1.146 .904 3.35 2.394 6.497 3.429c.483 .159 .725 .238 1.04 .238c.314 0 .555 -.08 1.04 -.238c3.146 -1.035 5.35 -2.525 6.496 -3.43c.402 -.317 .603 -.476 .797 -.816c.194 -.341 .232 -.62 .309 -1.178c.14 -1.021 .305 -2.596 .305 -4.338s-.165 -3.317 -.305 -4.338c-.077 -.558 -.115 -.837 -.309 -1.178s-.395 -.5 -.797 -.817" />
<path d="M9 8v7" />
<path d="M9 12h6" />
<path d="M16 16h-2l1 1l1 -1" />
<path d="M8 8h2l-1 -1l-1 1" />
<path d="M15 9v7" />
</svg> Use the Hackerrank icon
For a decorative icon beside text, add aria-hidden="true" to the SVG. For an icon-only control, put its accessible name on the button or link.
React example
import { IconBrandHackerrank } from '@tabler/icons-react';
<IconBrandHackerrank size={24} stroke={2} />Read the React guideVue example
import { IconBrandHackerrank } from '@tabler/icons-vue';
<IconBrandHackerrank :size="24" :stroke="2" />Read the Vue guideSvelte 5 example
import { IconBrandHackerrank } from '@tabler/icons-svelte-runes';
<IconBrandHackerrank size={24} stroke={2} />Read the Svelte guideRelated