medal icon
medal from Unicons by Iconscout · Line · Education · Apache-2.0 Free for personal and commercial use.
- Name
- medal
- Set
- Unicons
- Style
- Line
- Category
- Education
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
medalBoxIcons v2medalBoxIcons v2 SolidmedalElement PlusmedalFont Awesome 6 SolidmedalFont Awesome Solidmedal-16-filledFluent UI System IconsmedalIconoirmedalIonIconsmedalJam IconsmedalLine AwesomemedalLucidemedalMaterial Design Iconsmedal-fillMingCute IconmedalPhosphormedal-fillRemix IconmedalTabler Icons
More education icons from Unicons
Use the medal icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.38 5.76a1 1 0 0 0-.47-.61l-5.2-3a1 1 0 0 0-1.37.36L12 6.57L9.66 2.51a1 1 0 0 0-1.37-.36l-5.2 3a1 1 0 0 0-.47.61a1 1 0 0 0 .1.75l4 6.83A5.9 5.9 0 0 0 6 16a6 6 0 1 0 11.34-2.72l3.9-6.76a1 1 0 0 0 .14-.76M5 6.38l3.46-2L11.68 10A5.94 5.94 0 0 0 8 11.58ZM12 20a4 4 0 0 1-4-4a4 4 0 0 1 4-4a4 4 0 1 1 0 8m4-8.45a5.9 5.9 0 0 0-1.86-1.15l-.98-1.83l2.42-4.19l3.46 2Z"/></svg>
React
import type { SVGProps } from "react";
export function UilMedal(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.38 5.76a1 1 0 0 0-.47-.61l-5.2-3a1 1 0 0 0-1.37.36L12 6.57L9.66 2.51a1 1 0 0 0-1.37-.36l-5.2 3a1 1 0 0 0-.47.61a1 1 0 0 0 .1.75l4 6.83A5.9 5.9 0 0 0 6 16a6 6 0 1 0 11.34-2.72l3.9-6.76a1 1 0 0 0 .14-.76M5 6.38l3.46-2L11.68 10A5.94 5.94 0 0 0 8 11.58ZM12 20a4 4 0 0 1-4-4a4 4 0 0 1 4-4a4 4 0 1 1 0 8m4-8.45a5.9 5.9 0 0 0-1.86-1.15l-.98-1.83l2.42-4.19l3.46 2Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M21.38 5.76a1 1 0 0 0-.47-.61l-5.2-3a1 1 0 0 0-1.37.36L12 6.57L9.66 2.51a1 1 0 0 0-1.37-.36l-5.2 3a1 1 0 0 0-.47.61a1 1 0 0 0 .1.75l4 6.83A5.9 5.9 0 0 0 6 16a6 6 0 1 0 11.34-2.72l3.9-6.76a1 1 0 0 0 .14-.76M5 6.38l3.46-2L11.68 10A5.94 5.94 0 0 0 8 11.58ZM12 20a4 4 0 0 1-4-4a4 4 0 0 1 4-4a4 4 0 1 1 0 8m4-8.45a5.9 5.9 0 0 0-1.86-1.15l-.98-1.83l2.42-4.19l3.46 2Z"/></svg> </template>
CSS
.icon-medal {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.38%205.76a1%201%200%200%200-.47-.61l-5.2-3a1%201%200%200%200-1.37.36L12%206.57L9.66%202.51a1%201%200%200%200-1.37-.36l-5.2%203a1%201%200%200%200-.47.61a1%201%200%200%200%20.1.75l4%206.83A5.9%205.9%200%200%200%206%2016a6%206%200%201%200%2011.34-2.72l3.9-6.76a1%201%200%200%200%20.14-.76M5%206.38l3.46-2L11.68%2010A5.94%205.94%200%200%200%208%2011.58ZM12%2020a4%204%200%200%201-4-4a4%204%200%200%201%204-4a4%204%200%201%201%200%208m4-8.45a5.9%205.9%200%200%200-1.86-1.15l-.98-1.83l2.42-4.19l3.46%202Z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.38%205.76a1%201%200%200%200-.47-.61l-5.2-3a1%201%200%200%200-1.37.36L12%206.57L9.66%202.51a1%201%200%200%200-1.37-.36l-5.2%203a1%201%200%200%200-.47.61a1%201%200%200%200%20.1.75l4%206.83A5.9%205.9%200%200%200%206%2016a6%206%200%201%200%2011.34-2.72l3.9-6.76a1%201%200%200%200%20.14-.76M5%206.38l3.46-2L11.68%2010A5.94%205.94%200%200%200%208%2011.58ZM12%2020a4%204%200%200%201-4-4a4%204%200%200%201%204-4a4%204%200%201%201%200%208m4-8.45a5.9%205.9%200%200%200-1.86-1.15l-.98-1.83l2.42-4.19l3.46%202Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/uil/medal.svg?color=%231a73e8&size=48
