giftcard icon
giftcard-fill from Framework7 Icons by Vladimir Kharlampidi · Fill · MIT Free for personal and commercial use.
- Name
- giftcard-fill
- Set
- Framework7 Icons
- Style
- Fill
- Viewbox
- 56×56
- License
- MIT
1 other variant in Framework7 Icons
Use the giftcard icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2 27.42h16.36a9.8 9.8 0 0 1-2.584-1.665a7.7 7.7 0 0 1-1.752-2.278a6.04 6.04 0 0 1-.635-2.737q0-1.71.767-3.045a5.6 5.6 0 0 1 2.091-2.102q1.326-.767 3.012-.767q1.467 0 2.792.58a8.1 8.1 0 0 1 2.42 1.654a9.5 9.5 0 0 1 1.84 2.563V9h2.87v10.623a9.9 9.9 0 0 1 1.861-2.563a8.1 8.1 0 0 1 2.42-1.654a6.8 6.8 0 0 1 2.771-.58q1.686 0 3.012.767a5.6 5.6 0 0 1 2.091 2.102q.767 1.336.767 3.045q0 1.467-.624 2.737a7.5 7.5 0 0 1-1.742 2.278a9.7 9.7 0 0 1-2.606 1.665H53.47v2.606H31.458q.504 1.052 1.512 2.267a19 19 0 0 0 2.3 2.322a15.7 15.7 0 0 0 2.65 1.85q1.358.746 2.562.876q.92.088 1.413.625q.492.536.493 1.39q0 .767-.58 1.358q-.582.592-1.589.46q-1.358-.196-2.99-1.03a18 18 0 0 1-3.219-2.135a17.7 17.7 0 0 1-2.836-2.934q-1.25-1.632-1.818-3.428h-.175v14.762h-2.87V31.647h-.153q-.57 1.796-1.818 3.428a17.7 17.7 0 0 1-2.836 2.934a17.8 17.8 0 0 1-3.23 2.136q-1.644.832-2.98 1.03q-1.006.13-1.587-.46q-.58-.593-.58-1.359q0-.854.492-1.39q.493-.537 1.39-.625q1.228-.13 2.585-.887a16 16 0 0 0 2.65-1.861a19.6 19.6 0 0 0 2.3-2.311q1.008-1.204 1.511-2.256H2zm23.194-.35h.701v-.658q0-1.665-.514-3.143a9.1 9.1 0 0 0-1.413-2.628q-.898-1.15-2.059-1.807a4.95 4.95 0 0 0-2.475-.657q-1.248 0-1.993.756q-.744.755-.745 2.07q0 1.095.68 2.168q.678 1.073 1.861 1.96a9.8 9.8 0 0 0 2.716 1.413a9.9 9.9 0 0 0 3.241.525m5.104 0a10 10 0 0 0 3.263-.526a9.8 9.8 0 0 0 2.716-1.413q1.182-.887 1.85-1.96q.669-1.074.669-2.169q0-1.314-.734-2.07t-2.004-.755q-1.293 0-2.453.657t-2.059 1.807a9.3 9.3 0 0 0-1.424 2.628a9.3 9.3 0 0 0-.525 3.143v.657zM8.878 46.408h37.715q3.438 0 5.158-1.697q1.719-1.698 1.719-5.07V15.79q0-3.373-1.72-5.082T46.594 9H8.877Q5.44 9 3.72 10.697T2 15.79v23.85q0 3.374 1.72 5.07q1.719 1.698 5.157 1.698"/></svg>
React
import type { SVGProps } from "react";
export function F7GiftcardFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2 27.42h16.36a9.8 9.8 0 0 1-2.584-1.665a7.7 7.7 0 0 1-1.752-2.278a6.04 6.04 0 0 1-.635-2.737q0-1.71.767-3.045a5.6 5.6 0 0 1 2.091-2.102q1.326-.767 3.012-.767q1.467 0 2.792.58a8.1 8.1 0 0 1 2.42 1.654a9.5 9.5 0 0 1 1.84 2.563V9h2.87v10.623a9.9 9.9 0 0 1 1.861-2.563a8.1 8.1 0 0 1 2.42-1.654a6.8 6.8 0 0 1 2.771-.58q1.686 0 3.012.767a5.6 5.6 0 0 1 2.091 2.102q.767 1.336.767 3.045q0 1.467-.624 2.737a7.5 7.5 0 0 1-1.742 2.278a9.7 9.7 0 0 1-2.606 1.665H53.47v2.606H31.458q.504 1.052 1.512 2.267a19 19 0 0 0 2.3 2.322a15.7 15.7 0 0 0 2.65 1.85q1.358.746 2.562.876q.92.088 1.413.625q.492.536.493 1.39q0 .767-.58 1.358q-.582.592-1.589.46q-1.358-.196-2.99-1.03a18 18 0 0 1-3.219-2.135a17.7 17.7 0 0 1-2.836-2.934q-1.25-1.632-1.818-3.428h-.175v14.762h-2.87V31.647h-.153q-.57 1.796-1.818 3.428a17.7 17.7 0 0 1-2.836 2.934a17.8 17.8 0 0 1-3.23 2.136q-1.644.832-2.98 1.03q-1.006.13-1.587-.46q-.58-.593-.58-1.359q0-.854.492-1.39q.493-.537 1.39-.625q1.228-.13 2.585-.887a16 16 0 0 0 2.65-1.861a19.6 19.6 0 0 0 2.3-2.311q1.008-1.204 1.511-2.256H2zm23.194-.35h.701v-.658q0-1.665-.514-3.143a9.1 9.1 0 0 0-1.413-2.628q-.898-1.15-2.059-1.807a4.95 4.95 0 0 0-2.475-.657q-1.248 0-1.993.756q-.744.755-.745 2.07q0 1.095.68 2.168q.678 1.073 1.861 1.96a9.8 9.8 0 0 0 2.716 1.413a9.9 9.9 0 0 0 3.241.525m5.104 0a10 10 0 0 0 3.263-.526a9.8 9.8 0 0 0 2.716-1.413q1.182-.887 1.85-1.96q.669-1.074.669-2.169q0-1.314-.734-2.07t-2.004-.755q-1.293 0-2.453.657t-2.059 1.807a9.3 9.3 0 0 0-1.424 2.628a9.3 9.3 0 0 0-.525 3.143v.657zM8.878 46.408h37.715q3.438 0 5.158-1.697q1.719-1.698 1.719-5.07V15.79q0-3.373-1.72-5.082T46.594 9H8.877Q5.44 9 3.72 10.697T2 15.79v23.85q0 3.374 1.72 5.07q1.719 1.698 5.157 1.698"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2 27.42h16.36a9.8 9.8 0 0 1-2.584-1.665a7.7 7.7 0 0 1-1.752-2.278a6.04 6.04 0 0 1-.635-2.737q0-1.71.767-3.045a5.6 5.6 0 0 1 2.091-2.102q1.326-.767 3.012-.767q1.467 0 2.792.58a8.1 8.1 0 0 1 2.42 1.654a9.5 9.5 0 0 1 1.84 2.563V9h2.87v10.623a9.9 9.9 0 0 1 1.861-2.563a8.1 8.1 0 0 1 2.42-1.654a6.8 6.8 0 0 1 2.771-.58q1.686 0 3.012.767a5.6 5.6 0 0 1 2.091 2.102q.767 1.336.767 3.045q0 1.467-.624 2.737a7.5 7.5 0 0 1-1.742 2.278a9.7 9.7 0 0 1-2.606 1.665H53.47v2.606H31.458q.504 1.052 1.512 2.267a19 19 0 0 0 2.3 2.322a15.7 15.7 0 0 0 2.65 1.85q1.358.746 2.562.876q.92.088 1.413.625q.492.536.493 1.39q0 .767-.58 1.358q-.582.592-1.589.46q-1.358-.196-2.99-1.03a18 18 0 0 1-3.219-2.135a17.7 17.7 0 0 1-2.836-2.934q-1.25-1.632-1.818-3.428h-.175v14.762h-2.87V31.647h-.153q-.57 1.796-1.818 3.428a17.7 17.7 0 0 1-2.836 2.934a17.8 17.8 0 0 1-3.23 2.136q-1.644.832-2.98 1.03q-1.006.13-1.587-.46q-.58-.593-.58-1.359q0-.854.492-1.39q.493-.537 1.39-.625q1.228-.13 2.585-.887a16 16 0 0 0 2.65-1.861a19.6 19.6 0 0 0 2.3-2.311q1.008-1.204 1.511-2.256H2zm23.194-.35h.701v-.658q0-1.665-.514-3.143a9.1 9.1 0 0 0-1.413-2.628q-.898-1.15-2.059-1.807a4.95 4.95 0 0 0-2.475-.657q-1.248 0-1.993.756q-.744.755-.745 2.07q0 1.095.68 2.168q.678 1.073 1.861 1.96a9.8 9.8 0 0 0 2.716 1.413a9.9 9.9 0 0 0 3.241.525m5.104 0a10 10 0 0 0 3.263-.526a9.8 9.8 0 0 0 2.716-1.413q1.182-.887 1.85-1.96q.669-1.074.669-2.169q0-1.314-.734-2.07t-2.004-.755q-1.293 0-2.453.657t-2.059 1.807a9.3 9.3 0 0 0-1.424 2.628a9.3 9.3 0 0 0-.525 3.143v.657zM8.878 46.408h37.715q3.438 0 5.158-1.697q1.719-1.698 1.719-5.07V15.79q0-3.373-1.72-5.082T46.594 9H8.877Q5.44 9 3.72 10.697T2 15.79v23.85q0 3.374 1.72 5.07q1.719 1.698 5.157 1.698"/></svg> </template>
CSS
.icon-giftcard-fill {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2%2027.42h16.36a9.8%209.8%200%200%201-2.584-1.665a7.7%207.7%200%200%201-1.752-2.278a6.04%206.04%200%200%201-.635-2.737q0-1.71.767-3.045a5.6%205.6%200%200%201%202.091-2.102q1.326-.767%203.012-.767q1.467%200%202.792.58a8.1%208.1%200%200%201%202.42%201.654a9.5%209.5%200%200%201%201.84%202.563V9h2.87v10.623a9.9%209.9%200%200%201%201.861-2.563a8.1%208.1%200%200%201%202.42-1.654a6.8%206.8%200%200%201%202.771-.58q1.686%200%203.012.767a5.6%205.6%200%200%201%202.091%202.102q.767%201.336.767%203.045q0%201.467-.624%202.737a7.5%207.5%200%200%201-1.742%202.278a9.7%209.7%200%200%201-2.606%201.665H53.47v2.606H31.458q.504%201.052%201.512%202.267a19%2019%200%200%200%202.3%202.322a15.7%2015.7%200%200%200%202.65%201.85q1.358.746%202.562.876q.92.088%201.413.625q.492.536.493%201.39q0%20.767-.58%201.358q-.582.592-1.589.46q-1.358-.196-2.99-1.03a18%2018%200%200%201-3.219-2.135a17.7%2017.7%200%200%201-2.836-2.934q-1.25-1.632-1.818-3.428h-.175v14.762h-2.87V31.647h-.153q-.57%201.796-1.818%203.428a17.7%2017.7%200%200%201-2.836%202.934a17.8%2017.8%200%200%201-3.23%202.136q-1.644.832-2.98%201.03q-1.006.13-1.587-.46q-.58-.593-.58-1.359q0-.854.492-1.39q.493-.537%201.39-.625q1.228-.13%202.585-.887a16%2016%200%200%200%202.65-1.861a19.6%2019.6%200%200%200%202.3-2.311q1.008-1.204%201.511-2.256H2zm23.194-.35h.701v-.658q0-1.665-.514-3.143a9.1%209.1%200%200%200-1.413-2.628q-.898-1.15-2.059-1.807a4.95%204.95%200%200%200-2.475-.657q-1.248%200-1.993.756q-.744.755-.745%202.07q0%201.095.68%202.168q.678%201.073%201.861%201.96a9.8%209.8%200%200%200%202.716%201.413a9.9%209.9%200%200%200%203.241.525m5.104%200a10%2010%200%200%200%203.263-.526a9.8%209.8%200%200%200%202.716-1.413q1.182-.887%201.85-1.96q.669-1.074.669-2.169q0-1.314-.734-2.07t-2.004-.755q-1.293%200-2.453.657t-2.059%201.807a9.3%209.3%200%200%200-1.424%202.628a9.3%209.3%200%200%200-.525%203.143v.657zM8.878%2046.408h37.715q3.438%200%205.158-1.697q1.719-1.698%201.719-5.07V15.79q0-3.373-1.72-5.082T46.594%209H8.877Q5.44%209%203.72%2010.697T2%2015.79v23.85q0%203.374%201.72%205.07q1.719%201.698%205.157%201.698%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2%2027.42h16.36a9.8%209.8%200%200%201-2.584-1.665a7.7%207.7%200%200%201-1.752-2.278a6.04%206.04%200%200%201-.635-2.737q0-1.71.767-3.045a5.6%205.6%200%200%201%202.091-2.102q1.326-.767%203.012-.767q1.467%200%202.792.58a8.1%208.1%200%200%201%202.42%201.654a9.5%209.5%200%200%201%201.84%202.563V9h2.87v10.623a9.9%209.9%200%200%201%201.861-2.563a8.1%208.1%200%200%201%202.42-1.654a6.8%206.8%200%200%201%202.771-.58q1.686%200%203.012.767a5.6%205.6%200%200%201%202.091%202.102q.767%201.336.767%203.045q0%201.467-.624%202.737a7.5%207.5%200%200%201-1.742%202.278a9.7%209.7%200%200%201-2.606%201.665H53.47v2.606H31.458q.504%201.052%201.512%202.267a19%2019%200%200%200%202.3%202.322a15.7%2015.7%200%200%200%202.65%201.85q1.358.746%202.562.876q.92.088%201.413.625q.492.536.493%201.39q0%20.767-.58%201.358q-.582.592-1.589.46q-1.358-.196-2.99-1.03a18%2018%200%200%201-3.219-2.135a17.7%2017.7%200%200%201-2.836-2.934q-1.25-1.632-1.818-3.428h-.175v14.762h-2.87V31.647h-.153q-.57%201.796-1.818%203.428a17.7%2017.7%200%200%201-2.836%202.934a17.8%2017.8%200%200%201-3.23%202.136q-1.644.832-2.98%201.03q-1.006.13-1.587-.46q-.58-.593-.58-1.359q0-.854.492-1.39q.493-.537%201.39-.625q1.228-.13%202.585-.887a16%2016%200%200%200%202.65-1.861a19.6%2019.6%200%200%200%202.3-2.311q1.008-1.204%201.511-2.256H2zm23.194-.35h.701v-.658q0-1.665-.514-3.143a9.1%209.1%200%200%200-1.413-2.628q-.898-1.15-2.059-1.807a4.95%204.95%200%200%200-2.475-.657q-1.248%200-1.993.756q-.744.755-.745%202.07q0%201.095.68%202.168q.678%201.073%201.861%201.96a9.8%209.8%200%200%200%202.716%201.413a9.9%209.9%200%200%200%203.241.525m5.104%200a10%2010%200%200%200%203.263-.526a9.8%209.8%200%200%200%202.716-1.413q1.182-.887%201.85-1.96q.669-1.074.669-2.169q0-1.314-.734-2.07t-2.004-.755q-1.293%200-2.453.657t-2.059%201.807a9.3%209.3%200%200%200-1.424%202.628a9.3%209.3%200%200%200-.525%203.143v.657zM8.878%2046.408h37.715q3.438%200%205.158-1.697q1.719-1.698%201.719-5.07V15.79q0-3.373-1.72-5.082T46.594%209H8.877Q5.44%209%203.72%2010.697T2%2015.79v23.85q0%203.374%201.72%205.07q1.719%201.698%205.157%201.698%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/giftcard-fill.svg?color=%231a73e8&size=48
