<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><g clip-path="url(#media_camera_20__a)"><path d="M12.5 3.417a.75.75 0 0 1 .6.3l1.025 1.367H17.5a.75.75 0 0 1 .75.75v10a.75.75 0 0 1-.75.75h-15a.75.75 0 0 1-.75-.75v-10a.75.75 0 0 1 .75-.75h3.375L6.9 3.717l.057-.068a.75.75 0 0 1 .543-.232zM6.85 6.283a.75.75 0 0 1-.6.301h-3v8.5h13.5v-8.5h-3a.75.75 0 0 1-.6-.3l-1.025-1.367h-4.25zM10 6.75a3.667 3.667 0 1 1-.001 7.333A3.667 3.667 0 0 1 10 6.75m0 1.5a2.167 2.167 0 1 0 .001 4.335A2.167 2.167 0 0 0 10 8.25M5 7.5a.833.833 0 1 1 0 1.666A.833.833 0 0 1 5 7.5"/></g><defs><clipPath id="media_camera_20__a"><path fill="#fff" d="M0 0h20v20H0z"/></clipPath></defs></svg></template>
<script setup lang="ts">
/**
 * Camera20 is an SVG icon wrapped in a Vue component to make it easier to use.
 */
withDefaults(
  defineProps<{
    /**
     * Define the color of the icon.
     */
    color?: string;
  }>(),
  {
    color: 'currentColor',
  },
);
</script>
