file js icon
file-js-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- file-js-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Related icons in Phosphor
Use the file js icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m212.24 83.76l-56-56A6 6 0 0 0 152 26H56a14 14 0 0 0-14 14v72a6 6 0 0 0 12 0V40a2 2 0 0 1 2-2h90v50a6 6 0 0 0 6 6h50v122a2 2 0 0 1-2 2h-24a6 6 0 0 0 0 12h24a14 14 0 0 0 14-14V88a6 6 0 0 0-1.76-4.24M158 46.48L193.52 82H158Zm-12.17 149.58a18.89 18.89 0 0 1-8.31 13.81c-4.82 3.19-10.87 4.14-16.36 4.14a59 59 0 0 1-14.68-2a6 6 0 0 1 3.23-11.56c3.71 1 15.58 3.11 21.19-.62a6.85 6.85 0 0 0 3-5.34c.58-4.43-2.08-6.26-14.2-9.76c-9.31-2.69-23.37-6.75-21.57-20.94a18.61 18.61 0 0 1 8.08-13.54c11.11-7.49 29.18-3 31.21-2.48a6 6 0 0 1-3.06 11.6c-3.78-1-15.85-3-21.45.84a6.59 6.59 0 0 0-2.88 5.08c-.41 3.22 2.14 4.78 13 7.91c9.89 2.89 24.81 7.2 22.8 22.86M78 152v38a24 24 0 0 1-48 0a6 6 0 0 1 12 0a12 12 0 0 0 24 0v-38a6 6 0 0 1 12 0"/></svg>
React
import type { SVGProps } from "react";
export function PhFileJsLight(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m212.24 83.76l-56-56A6 6 0 0 0 152 26H56a14 14 0 0 0-14 14v72a6 6 0 0 0 12 0V40a2 2 0 0 1 2-2h90v50a6 6 0 0 0 6 6h50v122a2 2 0 0 1-2 2h-24a6 6 0 0 0 0 12h24a14 14 0 0 0 14-14V88a6 6 0 0 0-1.76-4.24M158 46.48L193.52 82H158Zm-12.17 149.58a18.89 18.89 0 0 1-8.31 13.81c-4.82 3.19-10.87 4.14-16.36 4.14a59 59 0 0 1-14.68-2a6 6 0 0 1 3.23-11.56c3.71 1 15.58 3.11 21.19-.62a6.85 6.85 0 0 0 3-5.34c.58-4.43-2.08-6.26-14.2-9.76c-9.31-2.69-23.37-6.75-21.57-20.94a18.61 18.61 0 0 1 8.08-13.54c11.11-7.49 29.18-3 31.21-2.48a6 6 0 0 1-3.06 11.6c-3.78-1-15.85-3-21.45.84a6.59 6.59 0 0 0-2.88 5.08c-.41 3.22 2.14 4.78 13 7.91c9.89 2.89 24.81 7.2 22.8 22.86M78 152v38a24 24 0 0 1-48 0a6 6 0 0 1 12 0a12 12 0 0 0 24 0v-38a6 6 0 0 1 12 0"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m212.24 83.76l-56-56A6 6 0 0 0 152 26H56a14 14 0 0 0-14 14v72a6 6 0 0 0 12 0V40a2 2 0 0 1 2-2h90v50a6 6 0 0 0 6 6h50v122a2 2 0 0 1-2 2h-24a6 6 0 0 0 0 12h24a14 14 0 0 0 14-14V88a6 6 0 0 0-1.76-4.24M158 46.48L193.52 82H158Zm-12.17 149.58a18.89 18.89 0 0 1-8.31 13.81c-4.82 3.19-10.87 4.14-16.36 4.14a59 59 0 0 1-14.68-2a6 6 0 0 1 3.23-11.56c3.71 1 15.58 3.11 21.19-.62a6.85 6.85 0 0 0 3-5.34c.58-4.43-2.08-6.26-14.2-9.76c-9.31-2.69-23.37-6.75-21.57-20.94a18.61 18.61 0 0 1 8.08-13.54c11.11-7.49 29.18-3 31.21-2.48a6 6 0 0 1-3.06 11.6c-3.78-1-15.85-3-21.45.84a6.59 6.59 0 0 0-2.88 5.08c-.41 3.22 2.14 4.78 13 7.91c9.89 2.89 24.81 7.2 22.8 22.86M78 152v38a24 24 0 0 1-48 0a6 6 0 0 1 12 0a12 12 0 0 0 24 0v-38a6 6 0 0 1 12 0"/></svg> </template>
CSS
.icon-file-js-light {
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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m212.24%2083.76l-56-56A6%206%200%200%200%20152%2026H56a14%2014%200%200%200-14%2014v72a6%206%200%200%200%2012%200V40a2%202%200%200%201%202-2h90v50a6%206%200%200%200%206%206h50v122a2%202%200%200%201-2%202h-24a6%206%200%200%200%200%2012h24a14%2014%200%200%200%2014-14V88a6%206%200%200%200-1.76-4.24M158%2046.48L193.52%2082H158Zm-12.17%20149.58a18.89%2018.89%200%200%201-8.31%2013.81c-4.82%203.19-10.87%204.14-16.36%204.14a59%2059%200%200%201-14.68-2a6%206%200%200%201%203.23-11.56c3.71%201%2015.58%203.11%2021.19-.62a6.85%206.85%200%200%200%203-5.34c.58-4.43-2.08-6.26-14.2-9.76c-9.31-2.69-23.37-6.75-21.57-20.94a18.61%2018.61%200%200%201%208.08-13.54c11.11-7.49%2029.18-3%2031.21-2.48a6%206%200%200%201-3.06%2011.6c-3.78-1-15.85-3-21.45.84a6.59%206.59%200%200%200-2.88%205.08c-.41%203.22%202.14%204.78%2013%207.91c9.89%202.89%2024.81%207.2%2022.8%2022.86M78%20152v38a24%2024%200%200%201-48%200a6%206%200%200%201%2012%200a12%2012%200%200%200%2024%200v-38a6%206%200%200%201%2012%200%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m212.24%2083.76l-56-56A6%206%200%200%200%20152%2026H56a14%2014%200%200%200-14%2014v72a6%206%200%200%200%2012%200V40a2%202%200%200%201%202-2h90v50a6%206%200%200%200%206%206h50v122a2%202%200%200%201-2%202h-24a6%206%200%200%200%200%2012h24a14%2014%200%200%200%2014-14V88a6%206%200%200%200-1.76-4.24M158%2046.48L193.52%2082H158Zm-12.17%20149.58a18.89%2018.89%200%200%201-8.31%2013.81c-4.82%203.19-10.87%204.14-16.36%204.14a59%2059%200%200%201-14.68-2a6%206%200%200%201%203.23-11.56c3.71%201%2015.58%203.11%2021.19-.62a6.85%206.85%200%200%200%203-5.34c.58-4.43-2.08-6.26-14.2-9.76c-9.31-2.69-23.37-6.75-21.57-20.94a18.61%2018.61%200%200%201%208.08-13.54c11.11-7.49%2029.18-3%2031.21-2.48a6%206%200%200%201-3.06%2011.6c-3.78-1-15.85-3-21.45.84a6.59%206.59%200%200%200-2.88%205.08c-.41%203.22%202.14%204.78%2013%207.91c9.89%202.89%2024.81%207.2%2022.8%2022.86M78%20152v38a24%2024%200%200%201-48%200a6%206%200%200%201%2012%200a12%2012%200%200%200%2024%200v-38a6%206%200%200%201%2012%200%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/file-js-light.svg?color=%231a73e8&size=48
