city icon
city-broken from Solar by 480 Design · Broken · Building · CC-BY-4.0 Attribution required.
- Name
- city-broken
- Set
- Solar
- Style
- Broken
- Category
- Building
- Viewbox
- 24×24
- License
- CC BY 4.0
5 other variants in Solar
The same icon in other sets
More building icons from Solar
Use the city 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-width="1.5"><path d="M3 22V18M11 12C11 10.1144 11 9.17157 10.4142 8.58579C9.82843 8 8.88562 8 7 8C5.11438 8 4.17157 8 3.58579 8.58579C3 9.17157 3 10.1144 3 12V14"/><path d="M7 22V16C7 14.1144 7 13.1716 7.58579 12.5858C8.17157 12 9.11438 12 11 12H13C14.8856 12 15.8284 12 16.4142 12.5858C16.8858 13.0573 16.9777 13.7602 16.9957 15M17 22V19.25"/><path d="M21 7.77195C21 6.4311 21 5.76068 20.6439 5.24676C20.2877 4.73283 19.66 4.49743 18.4045 4.02663C15.9492 3.10591 14.7216 2.64555 13.8608 3.2421C13 3.83864 13 5.14974 13 7.77195V11.9999M21 21.9999V11.9999"/><path d="M4 8V6.5C4 5.55719 4 5.08579 4.29289 4.79289C4.58579 4.5 5.05719 4.5 6 4.5H8C8.94281 4.5 9.41421 4.5 9.70711 4.79289C10 5.08579 10 5.55719 10 6.5V8"/><path d="M7 4V2"/><path d="M22 22L2 22"/><path d="M10 15H10.5M14 15H12.5"/><path d="M10 18H14"/></g></svg>
React
import type { SVGProps } from "react";
export function SolarCityBroken(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" strokeWidth="1.5"><path d="M3 22V18M11 12C11 10.1144 11 9.17157 10.4142 8.58579C9.82843 8 8.88562 8 7 8C5.11438 8 4.17157 8 3.58579 8.58579C3 9.17157 3 10.1144 3 12V14"/><path d="M7 22V16C7 14.1144 7 13.1716 7.58579 12.5858C8.17157 12 9.11438 12 11 12H13C14.8856 12 15.8284 12 16.4142 12.5858C16.8858 13.0573 16.9777 13.7602 16.9957 15M17 22V19.25"/><path d="M21 7.77195C21 6.4311 21 5.76068 20.6439 5.24676C20.2877 4.73283 19.66 4.49743 18.4045 4.02663C15.9492 3.10591 14.7216 2.64555 13.8608 3.2421C13 3.83864 13 5.14974 13 7.77195V11.9999M21 21.9999V11.9999"/><path d="M4 8V6.5C4 5.55719 4 5.08579 4.29289 4.79289C4.58579 4.5 5.05719 4.5 6 4.5H8C8.94281 4.5 9.41421 4.5 9.70711 4.79289C10 5.08579 10 5.55719 10 6.5V8"/><path d="M7 4V2"/><path d="M22 22L2 22"/><path d="M10 15H10.5M14 15H12.5"/><path d="M10 18H14"/></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-width="1.5"><path d="M3 22V18M11 12C11 10.1144 11 9.17157 10.4142 8.58579C9.82843 8 8.88562 8 7 8C5.11438 8 4.17157 8 3.58579 8.58579C3 9.17157 3 10.1144 3 12V14"/><path d="M7 22V16C7 14.1144 7 13.1716 7.58579 12.5858C8.17157 12 9.11438 12 11 12H13C14.8856 12 15.8284 12 16.4142 12.5858C16.8858 13.0573 16.9777 13.7602 16.9957 15M17 22V19.25"/><path d="M21 7.77195C21 6.4311 21 5.76068 20.6439 5.24676C20.2877 4.73283 19.66 4.49743 18.4045 4.02663C15.9492 3.10591 14.7216 2.64555 13.8608 3.2421C13 3.83864 13 5.14974 13 7.77195V11.9999M21 21.9999V11.9999"/><path d="M4 8V6.5C4 5.55719 4 5.08579 4.29289 4.79289C4.58579 4.5 5.05719 4.5 6 4.5H8C8.94281 4.5 9.41421 4.5 9.70711 4.79289C10 5.08579 10 5.55719 10 6.5V8"/><path d="M7 4V2"/><path d="M22 22L2 22"/><path d="M10 15H10.5M14 15H12.5"/><path d="M10 18H14"/></g></svg> </template>
CSS
.icon-city-broken {
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-width%3D%221.5%22%3E%3Cpath%20d%3D%22M3%2022V18M11%2012C11%2010.1144%2011%209.17157%2010.4142%208.58579C9.82843%208%208.88562%208%207%208C5.11438%208%204.17157%208%203.58579%208.58579C3%209.17157%203%2010.1144%203%2012V14%22%2F%3E%3Cpath%20d%3D%22M7%2022V16C7%2014.1144%207%2013.1716%207.58579%2012.5858C8.17157%2012%209.11438%2012%2011%2012H13C14.8856%2012%2015.8284%2012%2016.4142%2012.5858C16.8858%2013.0573%2016.9777%2013.7602%2016.9957%2015M17%2022V19.25%22%2F%3E%3Cpath%20d%3D%22M21%207.77195C21%206.4311%2021%205.76068%2020.6439%205.24676C20.2877%204.73283%2019.66%204.49743%2018.4045%204.02663C15.9492%203.10591%2014.7216%202.64555%2013.8608%203.2421C13%203.83864%2013%205.14974%2013%207.77195V11.9999M21%2021.9999V11.9999%22%2F%3E%3Cpath%20d%3D%22M4%208V6.5C4%205.55719%204%205.08579%204.29289%204.79289C4.58579%204.5%205.05719%204.5%206%204.5H8C8.94281%204.5%209.41421%204.5%209.70711%204.79289C10%205.08579%2010%205.55719%2010%206.5V8%22%2F%3E%3Cpath%20d%3D%22M7%204V2%22%2F%3E%3Cpath%20d%3D%22M22%2022L2%2022%22%2F%3E%3Cpath%20d%3D%22M10%2015H10.5M14%2015H12.5%22%2F%3E%3Cpath%20d%3D%22M10%2018H14%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-width%3D%221.5%22%3E%3Cpath%20d%3D%22M3%2022V18M11%2012C11%2010.1144%2011%209.17157%2010.4142%208.58579C9.82843%208%208.88562%208%207%208C5.11438%208%204.17157%208%203.58579%208.58579C3%209.17157%203%2010.1144%203%2012V14%22%2F%3E%3Cpath%20d%3D%22M7%2022V16C7%2014.1144%207%2013.1716%207.58579%2012.5858C8.17157%2012%209.11438%2012%2011%2012H13C14.8856%2012%2015.8284%2012%2016.4142%2012.5858C16.8858%2013.0573%2016.9777%2013.7602%2016.9957%2015M17%2022V19.25%22%2F%3E%3Cpath%20d%3D%22M21%207.77195C21%206.4311%2021%205.76068%2020.6439%205.24676C20.2877%204.73283%2019.66%204.49743%2018.4045%204.02663C15.9492%203.10591%2014.7216%202.64555%2013.8608%203.2421C13%203.83864%2013%205.14974%2013%207.77195V11.9999M21%2021.9999V11.9999%22%2F%3E%3Cpath%20d%3D%22M4%208V6.5C4%205.55719%204%205.08579%204.29289%204.79289C4.58579%204.5%205.05719%204.5%206%204.5H8C8.94281%204.5%209.41421%204.5%209.70711%204.79289C10%205.08579%2010%205.55719%2010%206.5V8%22%2F%3E%3Cpath%20d%3D%22M7%204V2%22%2F%3E%3Cpath%20d%3D%22M22%2022L2%2022%22%2F%3E%3Cpath%20d%3D%22M10%2015H10.5M14%2015H12.5%22%2F%3E%3Cpath%20d%3D%22M10%2018H14%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/solar/city-broken.svg?color=%231a73e8&size=48
