sun medium icon
sun-medium-two-tone from Keyline Icons by Keyline Icons · Two Tone · MIT Free for personal and commercial use.
- Name
- sun-medium-two-tone
- Set
- Keyline Icons
- Style
- Two Tone
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
The same icon in other sets
Related icons in Keyline Icons
Use the sun medium icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" fill-opacity=".4" d="M17.5 12C17.5 15.0376 15.0376 17.5 12 17.5C8.9624 17.5 6.5 15.0376 6.5 12C6.5 8.9624 8.9624 6.5 12 6.5C15.0376 6.5 17.5 8.9624 17.5 12Z" stroke="none"/><path d="M16.5 12C16.5 14.4853 14.4853 16.5 12 16.5C9.5147 16.5 7.5 14.4853 7.5 12C7.5 9.5147 9.5147 7.5 12 7.5C14.4853 7.5 16.5 9.5147 16.5 12ZM20.5 12L21 12M18.0104 18.0104L18.364 18.364M12 20.5L12 21M5.9896 18.0104L5.636 18.364M3.5 12L3 12M5.9896 5.9896L5.636 5.636M12 3.5L12 3M18.0104 5.9896L18.364 5.636"/></g></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsSunMediumTwoTone(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"><path fill="currentColor" fillOpacity=".4" d="M17.5 12C17.5 15.0376 15.0376 17.5 12 17.5C8.9624 17.5 6.5 15.0376 6.5 12C6.5 8.9624 8.9624 6.5 12 6.5C15.0376 6.5 17.5 8.9624 17.5 12Z" stroke="none"/><path d="M16.5 12C16.5 14.4853 14.4853 16.5 12 16.5C9.5147 16.5 7.5 14.4853 7.5 12C7.5 9.5147 9.5147 7.5 12 7.5C14.4853 7.5 16.5 9.5147 16.5 12ZM20.5 12L21 12M18.0104 18.0104L18.364 18.364M12 20.5L12 21M5.9896 18.0104L5.636 18.364M3.5 12L3 12M5.9896 5.9896L5.636 5.636M12 3.5L12 3M18.0104 5.9896L18.364 5.636"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="currentColor" fill-opacity=".4" d="M17.5 12C17.5 15.0376 15.0376 17.5 12 17.5C8.9624 17.5 6.5 15.0376 6.5 12C6.5 8.9624 8.9624 6.5 12 6.5C15.0376 6.5 17.5 8.9624 17.5 12Z" stroke="none"/><path d="M16.5 12C16.5 14.4853 14.4853 16.5 12 16.5C9.5147 16.5 7.5 14.4853 7.5 12C7.5 9.5147 9.5147 7.5 12 7.5C14.4853 7.5 16.5 9.5147 16.5 12ZM20.5 12L21 12M18.0104 18.0104L18.364 18.364M12 20.5L12 21M5.9896 18.0104L5.636 18.364M3.5 12L3 12M5.9896 5.9896L5.636 5.636M12 3.5L12 3M18.0104 5.9896L18.364 5.636"/></g></svg> </template>
CSS
.icon-sun-medium-two-tone {
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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-opacity%3D%22.4%22%20d%3D%22M17.5%2012C17.5%2015.0376%2015.0376%2017.5%2012%2017.5C8.9624%2017.5%206.5%2015.0376%206.5%2012C6.5%208.9624%208.9624%206.5%2012%206.5C15.0376%206.5%2017.5%208.9624%2017.5%2012Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M16.5%2012C16.5%2014.4853%2014.4853%2016.5%2012%2016.5C9.5147%2016.5%207.5%2014.4853%207.5%2012C7.5%209.5147%209.5147%207.5%2012%207.5C14.4853%207.5%2016.5%209.5147%2016.5%2012ZM20.5%2012L21%2012M18.0104%2018.0104L18.364%2018.364M12%2020.5L12%2021M5.9896%2018.0104L5.636%2018.364M3.5%2012L3%2012M5.9896%205.9896L5.636%205.636M12%203.5L12%203M18.0104%205.9896L18.364%205.636%22%2F%3E%3C%2Fg%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-opacity%3D%22.4%22%20d%3D%22M17.5%2012C17.5%2015.0376%2015.0376%2017.5%2012%2017.5C8.9624%2017.5%206.5%2015.0376%206.5%2012C6.5%208.9624%208.9624%206.5%2012%206.5C15.0376%206.5%2017.5%208.9624%2017.5%2012Z%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M16.5%2012C16.5%2014.4853%2014.4853%2016.5%2012%2016.5C9.5147%2016.5%207.5%2014.4853%207.5%2012C7.5%209.5147%209.5147%207.5%2012%207.5C14.4853%207.5%2016.5%209.5147%2016.5%2012ZM20.5%2012L21%2012M18.0104%2018.0104L18.364%2018.364M12%2020.5L12%2021M5.9896%2018.0104L5.636%2018.364M3.5%2012L3%2012M5.9896%205.9896L5.636%205.636M12%203.5L12%203M18.0104%205.9896L18.364%205.636%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/sun-medium-two-tone.svg?color=%231a73e8&size=48
