component 1 icon
component-1 from Radix Icons by WorkOS · Outline · MIT Free for personal and commercial use.
- Name
- component-1
- Set
- Radix Icons
- Style
- Outline
- Viewbox
- 15×15
- License
- MIT
Related icons in Radix Icons
Use the component 1 icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 15 15"><path fill="currentColor" d="M7.224 8.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 14.33a.5.5 0 0 1-.707 0L4.67 11.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM5.732 11.5l1.767 1.767L9.267 11.5L7.499 9.732zM3.224 4.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L3.853 10.33a.5.5 0 0 1-.707 0L.67 7.853l-.064-.077a.5.5 0 0 1 .064-.63l2.475-2.474zm8 0a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707l-2.476 2.476a.5.5 0 0 1-.707 0L8.67 7.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM1.732 7.5l1.767 1.768L5.267 7.5L3.499 5.732zm8 0l1.767 1.767L13.267 7.5l-1.768-1.768zM7.224.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 6.33a.5.5 0 0 1-.707 0L4.67 3.853l-.064-.078a.5.5 0 0 1 .064-.629L7.146.672zM5.732 3.5l1.767 1.767L9.267 3.5L7.499 1.732z"/></svg>
React
import type { SVGProps } from "react";
export function RadixIconsComponent1(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 15 15"><path fill="currentColor" d="M7.224 8.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 14.33a.5.5 0 0 1-.707 0L4.67 11.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM5.732 11.5l1.767 1.767L9.267 11.5L7.499 9.732zM3.224 4.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L3.853 10.33a.5.5 0 0 1-.707 0L.67 7.853l-.064-.077a.5.5 0 0 1 .064-.63l2.475-2.474zm8 0a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707l-2.476 2.476a.5.5 0 0 1-.707 0L8.67 7.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM1.732 7.5l1.767 1.768L5.267 7.5L3.499 5.732zm8 0l1.767 1.767L13.267 7.5l-1.768-1.768zM7.224.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 6.33a.5.5 0 0 1-.707 0L4.67 3.853l-.064-.078a.5.5 0 0 1 .064-.629L7.146.672zM5.732 3.5l1.767 1.767L9.267 3.5L7.499 1.732z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 15 15"><path fill="currentColor" d="M7.224 8.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 14.33a.5.5 0 0 1-.707 0L4.67 11.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM5.732 11.5l1.767 1.767L9.267 11.5L7.499 9.732zM3.224 4.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L3.853 10.33a.5.5 0 0 1-.707 0L.67 7.853l-.064-.077a.5.5 0 0 1 .064-.63l2.475-2.474zm8 0a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707l-2.476 2.476a.5.5 0 0 1-.707 0L8.67 7.853l-.064-.078a.5.5 0 0 1 .064-.629l2.475-2.474zM1.732 7.5l1.767 1.768L5.267 7.5L3.499 5.732zm8 0l1.767 1.767L13.267 7.5l-1.768-1.768zM7.224.607a.5.5 0 0 1 .629.065l2.476 2.474a.5.5 0 0 1 0 .707L7.853 6.33a.5.5 0 0 1-.707 0L4.67 3.853l-.064-.078a.5.5 0 0 1 .064-.629L7.146.672zM5.732 3.5l1.767 1.767L9.267 3.5L7.499 1.732z"/></svg> </template>
CSS
.icon-component-1 {
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%2015%2015%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.224%208.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L7.853%2014.33a.5.5%200%200%201-.707%200L4.67%2011.853l-.064-.078a.5.5%200%200%201%20.064-.629l2.475-2.474zM5.732%2011.5l1.767%201.767L9.267%2011.5L7.499%209.732zM3.224%204.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L3.853%2010.33a.5.5%200%200%201-.707%200L.67%207.853l-.064-.077a.5.5%200%200%201%20.064-.63l2.475-2.474zm8%200a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707l-2.476%202.476a.5.5%200%200%201-.707%200L8.67%207.853l-.064-.078a.5.5%200%200%201%20.064-.629l2.475-2.474zM1.732%207.5l1.767%201.768L5.267%207.5L3.499%205.732zm8%200l1.767%201.767L13.267%207.5l-1.768-1.768zM7.224.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L7.853%206.33a.5.5%200%200%201-.707%200L4.67%203.853l-.064-.078a.5.5%200%200%201%20.064-.629L7.146.672zM5.732%203.5l1.767%201.767L9.267%203.5L7.499%201.732z%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%2015%2015%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.224%208.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L7.853%2014.33a.5.5%200%200%201-.707%200L4.67%2011.853l-.064-.078a.5.5%200%200%201%20.064-.629l2.475-2.474zM5.732%2011.5l1.767%201.767L9.267%2011.5L7.499%209.732zM3.224%204.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L3.853%2010.33a.5.5%200%200%201-.707%200L.67%207.853l-.064-.077a.5.5%200%200%201%20.064-.63l2.475-2.474zm8%200a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707l-2.476%202.476a.5.5%200%200%201-.707%200L8.67%207.853l-.064-.078a.5.5%200%200%201%20.064-.629l2.475-2.474zM1.732%207.5l1.767%201.768L5.267%207.5L3.499%205.732zm8%200l1.767%201.767L13.267%207.5l-1.768-1.768zM7.224.607a.5.5%200%200%201%20.629.065l2.476%202.474a.5.5%200%200%201%200%20.707L7.853%206.33a.5.5%200%200%201-.707%200L4.67%203.853l-.064-.078a.5.5%200%200%201%20.064-.629L7.146.672zM5.732%203.5l1.767%201.767L9.267%203.5L7.499%201.732z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/radix-icons/component-1.svg?color=%231a73e8&size=48
