camera on rectangle icon
camera-on-rectangle-fill from Framework7 Icons by Vladimir Kharlampidi · Fill · MIT Free for personal and commercial use.
- Name
- camera-on-rectangle-fill
- Set
- Framework7 Icons
- Style
- Fill
- Viewbox
- 56×56
- License
- MIT
1 other variant in Framework7 Icons
Related icons in Framework7 Icons
Use the camera on rectangle icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M0 35.88c0 4.038 2.058 6.057 6.155 6.057h1.097V25.982c0-5.273 3.078-8.232 8.154-8.232h4.038c1.608 0 2.196-.373 3.058-1.392l1.176-1.411c1.02-1.235 2.372-1.921 4.606-1.921h9.095c2.078 0 3.156.549 4.646 1.92v-1.038c0-3.49-2.058-5.528-6.136-5.528H6.155C2.058 8.38 0 10.42 0 14.457Zm16.073 17.21h33.772c4.077 0 6.155-2.038 6.155-6.076V26.492c0-4.038-2.078-6.077-6.155-6.077H45.26c-1.53 0-2-.294-2.882-1.293l-1.568-1.745c-.98-1.078-1.98-1.666-3.998-1.666H28.99c-2.019 0-3.019.588-3.999 1.666l-1.587 1.745c-.863.98-1.353 1.293-2.882 1.293h-4.45c-4.076 0-6.154 2.039-6.154 6.077v20.522c0 4.038 2.078 6.076 6.155 6.076m16.896-6.292c-5.94 0-10.702-4.743-10.702-10.721a10.654 10.654 0 0 1 10.702-10.703c5.939 0 10.682 4.744 10.682 10.703c0 5.978-4.763 10.721-10.682 10.721m14.073-15.504c-1.333 0-2.43-1.078-2.43-2.411a2.43 2.43 0 1 1 4.86 0c0 1.333-1.097 2.41-2.43 2.41M32.97 43.819a7.704 7.704 0 0 0 7.722-7.742a7.7 7.7 0 0 0-7.722-7.723c-4.273 0-7.742 3.43-7.742 7.723a7.734 7.734 0 0 0 7.742 7.742"/></svg>
React
import type { SVGProps } from "react";
export function F7CameraOnRectangleFill(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="M0 35.88c0 4.038 2.058 6.057 6.155 6.057h1.097V25.982c0-5.273 3.078-8.232 8.154-8.232h4.038c1.608 0 2.196-.373 3.058-1.392l1.176-1.411c1.02-1.235 2.372-1.921 4.606-1.921h9.095c2.078 0 3.156.549 4.646 1.92v-1.038c0-3.49-2.058-5.528-6.136-5.528H6.155C2.058 8.38 0 10.42 0 14.457Zm16.073 17.21h33.772c4.077 0 6.155-2.038 6.155-6.076V26.492c0-4.038-2.078-6.077-6.155-6.077H45.26c-1.53 0-2-.294-2.882-1.293l-1.568-1.745c-.98-1.078-1.98-1.666-3.998-1.666H28.99c-2.019 0-3.019.588-3.999 1.666l-1.587 1.745c-.863.98-1.353 1.293-2.882 1.293h-4.45c-4.076 0-6.154 2.039-6.154 6.077v20.522c0 4.038 2.078 6.076 6.155 6.076m16.896-6.292c-5.94 0-10.702-4.743-10.702-10.721a10.654 10.654 0 0 1 10.702-10.703c5.939 0 10.682 4.744 10.682 10.703c0 5.978-4.763 10.721-10.682 10.721m14.073-15.504c-1.333 0-2.43-1.078-2.43-2.411a2.43 2.43 0 1 1 4.86 0c0 1.333-1.097 2.41-2.43 2.41M32.97 43.819a7.704 7.704 0 0 0 7.722-7.742a7.7 7.7 0 0 0-7.722-7.723c-4.273 0-7.742 3.43-7.742 7.723a7.734 7.734 0 0 0 7.742 7.742"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M0 35.88c0 4.038 2.058 6.057 6.155 6.057h1.097V25.982c0-5.273 3.078-8.232 8.154-8.232h4.038c1.608 0 2.196-.373 3.058-1.392l1.176-1.411c1.02-1.235 2.372-1.921 4.606-1.921h9.095c2.078 0 3.156.549 4.646 1.92v-1.038c0-3.49-2.058-5.528-6.136-5.528H6.155C2.058 8.38 0 10.42 0 14.457Zm16.073 17.21h33.772c4.077 0 6.155-2.038 6.155-6.076V26.492c0-4.038-2.078-6.077-6.155-6.077H45.26c-1.53 0-2-.294-2.882-1.293l-1.568-1.745c-.98-1.078-1.98-1.666-3.998-1.666H28.99c-2.019 0-3.019.588-3.999 1.666l-1.587 1.745c-.863.98-1.353 1.293-2.882 1.293h-4.45c-4.076 0-6.154 2.039-6.154 6.077v20.522c0 4.038 2.078 6.076 6.155 6.076m16.896-6.292c-5.94 0-10.702-4.743-10.702-10.721a10.654 10.654 0 0 1 10.702-10.703c5.939 0 10.682 4.744 10.682 10.703c0 5.978-4.763 10.721-10.682 10.721m14.073-15.504c-1.333 0-2.43-1.078-2.43-2.411a2.43 2.43 0 1 1 4.86 0c0 1.333-1.097 2.41-2.43 2.41M32.97 43.819a7.704 7.704 0 0 0 7.722-7.742a7.7 7.7 0 0 0-7.722-7.723c-4.273 0-7.742 3.43-7.742 7.723a7.734 7.734 0 0 0 7.742 7.742"/></svg> </template>
CSS
.icon-camera-on-rectangle-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%22M0%2035.88c0%204.038%202.058%206.057%206.155%206.057h1.097V25.982c0-5.273%203.078-8.232%208.154-8.232h4.038c1.608%200%202.196-.373%203.058-1.392l1.176-1.411c1.02-1.235%202.372-1.921%204.606-1.921h9.095c2.078%200%203.156.549%204.646%201.92v-1.038c0-3.49-2.058-5.528-6.136-5.528H6.155C2.058%208.38%200%2010.42%200%2014.457Zm16.073%2017.21h33.772c4.077%200%206.155-2.038%206.155-6.076V26.492c0-4.038-2.078-6.077-6.155-6.077H45.26c-1.53%200-2-.294-2.882-1.293l-1.568-1.745c-.98-1.078-1.98-1.666-3.998-1.666H28.99c-2.019%200-3.019.588-3.999%201.666l-1.587%201.745c-.863.98-1.353%201.293-2.882%201.293h-4.45c-4.076%200-6.154%202.039-6.154%206.077v20.522c0%204.038%202.078%206.076%206.155%206.076m16.896-6.292c-5.94%200-10.702-4.743-10.702-10.721a10.654%2010.654%200%200%201%2010.702-10.703c5.939%200%2010.682%204.744%2010.682%2010.703c0%205.978-4.763%2010.721-10.682%2010.721m14.073-15.504c-1.333%200-2.43-1.078-2.43-2.411a2.43%202.43%200%201%201%204.86%200c0%201.333-1.097%202.41-2.43%202.41M32.97%2043.819a7.704%207.704%200%200%200%207.722-7.742a7.7%207.7%200%200%200-7.722-7.723c-4.273%200-7.742%203.43-7.742%207.723a7.734%207.734%200%200%200%207.742%207.742%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%22M0%2035.88c0%204.038%202.058%206.057%206.155%206.057h1.097V25.982c0-5.273%203.078-8.232%208.154-8.232h4.038c1.608%200%202.196-.373%203.058-1.392l1.176-1.411c1.02-1.235%202.372-1.921%204.606-1.921h9.095c2.078%200%203.156.549%204.646%201.92v-1.038c0-3.49-2.058-5.528-6.136-5.528H6.155C2.058%208.38%200%2010.42%200%2014.457Zm16.073%2017.21h33.772c4.077%200%206.155-2.038%206.155-6.076V26.492c0-4.038-2.078-6.077-6.155-6.077H45.26c-1.53%200-2-.294-2.882-1.293l-1.568-1.745c-.98-1.078-1.98-1.666-3.998-1.666H28.99c-2.019%200-3.019.588-3.999%201.666l-1.587%201.745c-.863.98-1.353%201.293-2.882%201.293h-4.45c-4.076%200-6.154%202.039-6.154%206.077v20.522c0%204.038%202.078%206.076%206.155%206.076m16.896-6.292c-5.94%200-10.702-4.743-10.702-10.721a10.654%2010.654%200%200%201%2010.702-10.703c5.939%200%2010.682%204.744%2010.682%2010.703c0%205.978-4.763%2010.721-10.682%2010.721m14.073-15.504c-1.333%200-2.43-1.078-2.43-2.411a2.43%202.43%200%201%201%204.86%200c0%201.333-1.097%202.41-2.43%202.41M32.97%2043.819a7.704%207.704%200%200%200%207.722-7.742a7.7%207.7%200%200%200-7.722-7.723c-4.273%200-7.742%203.43-7.742%207.723a7.734%207.734%200%200%200%207.742%207.742%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/camera-on-rectangle-fill.svg?color=%231a73e8&size=48
