hockey puck icon

hockey-puck from Font Awesome 6 Solid by Dave Gandy · Regular · Sports · CC-BY-4.0 Attribution required.

Name
hockey-puck
Set
Font Awesome 6 Solid
Style
Regular
Category
Sports
Viewbox
512×512
License
CC BY 4.0

The same icon in other sets

hockey-puckFont Awesome Solidhockey-puckLine Awesomehockey-puckMaterial Design Icons

More sports icons from Font Awesome 6 Solid

bowling-ball

Use the hockey puck icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M256 256C114.6 256 0 213 0 160s114.6-96 256-96s256 43 256 96s-114.6 96-256 96m192.3 1.8c24.7-9.3 46.9-21 63.7-35.6V352c0 53-114.6 96-256 96S0 405 0 352V222.3c16.8 14.6 39 26.3 63.7 35.6c50.8 19 118.8 30.1 192.3 30.1s141.5-11.1 192.3-30.2"/></svg>

React

import type { SVGProps } from "react";

export function Fa6SolidHockeyPuck(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M256 256C114.6 256 0 213 0 160s114.6-96 256-96s256 43 256 96s-114.6 96-256 96m192.3 1.8c24.7-9.3 46.9-21 63.7-35.6V352c0 53-114.6 96-256 96S0 405 0 352V222.3c16.8 14.6 39 26.3 63.7 35.6c50.8 19 118.8 30.1 192.3 30.1s141.5-11.1 192.3-30.2"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M256 256C114.6 256 0 213 0 160s114.6-96 256-96s256 43 256 96s-114.6 96-256 96m192.3 1.8c24.7-9.3 46.9-21 63.7-35.6V352c0 53-114.6 96-256 96S0 405 0 352V222.3c16.8 14.6 39 26.3 63.7 35.6c50.8 19 118.8 30.1 192.3 30.1s141.5-11.1 192.3-30.2"/></svg>
</template>

CSS

.icon-hockey-puck {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M256%20256C114.6%20256%200%20213%200%20160s114.6-96%20256-96s256%2043%20256%2096s-114.6%2096-256%2096m192.3%201.8c24.7-9.3%2046.9-21%2063.7-35.6V352c0%2053-114.6%2096-256%2096S0%20405%200%20352V222.3c16.8%2014.6%2039%2026.3%2063.7%2035.6c50.8%2019%20118.8%2030.1%20192.3%2030.1s141.5-11.1%20192.3-30.2%22%2F%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M256%20256C114.6%20256%200%20213%200%20160s114.6-96%20256-96s256%2043%20256%2096s-114.6%2096-256%2096m192.3%201.8c24.7-9.3%2046.9-21%2063.7-35.6V352c0%2053-114.6%2096-256%2096S0%20405%200%20352V222.3c16.8%2014.6%2039%2026.3%2063.7%2035.6c50.8%2019%20118.8%2030.1%20192.3%2030.1s141.5-11.1%20192.3-30.2%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa6-solid/hockey-puck.svg?color=%231a73e8&size=48