nextcloud logo
nextcloud from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- nextcloud
- Set
- Simple Icons
- Style
- Brand
- Viewbox
- 24×24
- License
- CC0 1.0
The same logo in other sets
Use the nextcloud logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.018 6.537c-2.5 0-4.6 1.712-5.241 4.015c-.56-1.232-1.793-2.105-3.225-2.105A3.57 3.57 0 0 0 0 12a3.57 3.57 0 0 0 3.552 3.553c1.432 0 2.664-.874 3.224-2.106c.641 2.304 2.742 4.016 5.242 4.016c2.487 0 4.576-1.693 5.231-3.977c.569 1.21 1.783 2.067 3.198 2.067A3.57 3.57 0 0 0 24 12a3.57 3.57 0 0 0-3.553-3.553c-1.416 0-2.63.858-3.199 2.067c-.654-2.284-2.743-3.978-5.23-3.977m0 2.085c1.878 0 3.378 1.5 3.378 3.378s-1.5 3.378-3.378 3.378A3.36 3.36 0 0 1 8.641 12c0-1.878 1.5-3.378 3.377-3.378m-8.466 1.91c.822 0 1.467.645 1.467 1.468s-.644 1.467-1.467 1.468A1.45 1.45 0 0 1 2.085 12a1.45 1.45 0 0 1 1.467-1.467zm16.895 0c.823 0 1.468.645 1.468 1.468s-.645 1.468-1.468 1.468A1.45 1.45 0 0 1 18.98 12a1.45 1.45 0 0 1 1.467-1.467z"/></svg>
React
import type { SVGProps } from "react";
export function SimpleIconsNextcloud(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.018 6.537c-2.5 0-4.6 1.712-5.241 4.015c-.56-1.232-1.793-2.105-3.225-2.105A3.57 3.57 0 0 0 0 12a3.57 3.57 0 0 0 3.552 3.553c1.432 0 2.664-.874 3.224-2.106c.641 2.304 2.742 4.016 5.242 4.016c2.487 0 4.576-1.693 5.231-3.977c.569 1.21 1.783 2.067 3.198 2.067A3.57 3.57 0 0 0 24 12a3.57 3.57 0 0 0-3.553-3.553c-1.416 0-2.63.858-3.199 2.067c-.654-2.284-2.743-3.978-5.23-3.977m0 2.085c1.878 0 3.378 1.5 3.378 3.378s-1.5 3.378-3.378 3.378A3.36 3.36 0 0 1 8.641 12c0-1.878 1.5-3.378 3.377-3.378m-8.466 1.91c.822 0 1.467.645 1.467 1.468s-.644 1.467-1.467 1.468A1.45 1.45 0 0 1 2.085 12a1.45 1.45 0 0 1 1.467-1.467zm16.895 0c.823 0 1.468.645 1.468 1.468s-.645 1.468-1.468 1.468A1.45 1.45 0 0 1 18.98 12a1.45 1.45 0 0 1 1.467-1.467z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.018 6.537c-2.5 0-4.6 1.712-5.241 4.015c-.56-1.232-1.793-2.105-3.225-2.105A3.57 3.57 0 0 0 0 12a3.57 3.57 0 0 0 3.552 3.553c1.432 0 2.664-.874 3.224-2.106c.641 2.304 2.742 4.016 5.242 4.016c2.487 0 4.576-1.693 5.231-3.977c.569 1.21 1.783 2.067 3.198 2.067A3.57 3.57 0 0 0 24 12a3.57 3.57 0 0 0-3.553-3.553c-1.416 0-2.63.858-3.199 2.067c-.654-2.284-2.743-3.978-5.23-3.977m0 2.085c1.878 0 3.378 1.5 3.378 3.378s-1.5 3.378-3.378 3.378A3.36 3.36 0 0 1 8.641 12c0-1.878 1.5-3.378 3.377-3.378m-8.466 1.91c.822 0 1.467.645 1.467 1.468s-.644 1.467-1.467 1.468A1.45 1.45 0 0 1 2.085 12a1.45 1.45 0 0 1 1.467-1.467zm16.895 0c.823 0 1.468.645 1.468 1.468s-.645 1.468-1.468 1.468A1.45 1.45 0 0 1 18.98 12a1.45 1.45 0 0 1 1.467-1.467z"/></svg> </template>
CSS
.icon-nextcloud {
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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.018%206.537c-2.5%200-4.6%201.712-5.241%204.015c-.56-1.232-1.793-2.105-3.225-2.105A3.57%203.57%200%200%200%200%2012a3.57%203.57%200%200%200%203.552%203.553c1.432%200%202.664-.874%203.224-2.106c.641%202.304%202.742%204.016%205.242%204.016c2.487%200%204.576-1.693%205.231-3.977c.569%201.21%201.783%202.067%203.198%202.067A3.57%203.57%200%200%200%2024%2012a3.57%203.57%200%200%200-3.553-3.553c-1.416%200-2.63.858-3.199%202.067c-.654-2.284-2.743-3.978-5.23-3.977m0%202.085c1.878%200%203.378%201.5%203.378%203.378s-1.5%203.378-3.378%203.378A3.36%203.36%200%200%201%208.641%2012c0-1.878%201.5-3.378%203.377-3.378m-8.466%201.91c.822%200%201.467.645%201.467%201.468s-.644%201.467-1.467%201.468A1.45%201.45%200%200%201%202.085%2012a1.45%201.45%200%200%201%201.467-1.467zm16.895%200c.823%200%201.468.645%201.468%201.468s-.645%201.468-1.468%201.468A1.45%201.45%200%200%201%2018.98%2012a1.45%201.45%200%200%201%201.467-1.467z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.018%206.537c-2.5%200-4.6%201.712-5.241%204.015c-.56-1.232-1.793-2.105-3.225-2.105A3.57%203.57%200%200%200%200%2012a3.57%203.57%200%200%200%203.552%203.553c1.432%200%202.664-.874%203.224-2.106c.641%202.304%202.742%204.016%205.242%204.016c2.487%200%204.576-1.693%205.231-3.977c.569%201.21%201.783%202.067%203.198%202.067A3.57%203.57%200%200%200%2024%2012a3.57%203.57%200%200%200-3.553-3.553c-1.416%200-2.63.858-3.199%202.067c-.654-2.284-2.743-3.978-5.23-3.977m0%202.085c1.878%200%203.378%201.5%203.378%203.378s-1.5%203.378-3.378%203.378A3.36%203.36%200%200%201%208.641%2012c0-1.878%201.5-3.378%203.377-3.378m-8.466%201.91c.822%200%201.467.645%201.467%201.468s-.644%201.467-1.467%201.468A1.45%201.45%200%200%201%202.085%2012a1.45%201.45%200%200%201%201.467-1.467zm16.895%200c.823%200%201.468.645%201.468%201.468s-.645%201.468-1.468%201.468A1.45%201.45%200%200%201%2018.98%2012a1.45%201.45%200%200%201%201.467-1.467z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/nextcloud.svg?color=%231a73e8&size=48
