thymeleaf logo
thymeleaf from Devicon by konpa · Original · MIT Free for personal and commercial use.
- Name
- thymeleaf
- Set
- Devicon
- Style
- Original
- Viewbox
- 128×128
- License
- MIT
1 other variant in Devicon
The same logo in other sets
Use the thymeleaf logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#005f0f" d="M9.211 0H118.79a9.084 9.084 0 0 1 9.103 9.104v109.792A9.084 9.084 0 0 1 118.79 128H9.21a9.084 9.084 0 0 1-9.103-9.104V9.104A9.084 9.084 0 0 1 9.21 0z"/><path fill="#fff" d="M109.017 17.453C93.28 36.737 74.06 52.889 53.564 66.89c-6.663 4.77-14.018 9.015-19.141 15.546c-1.957 3.437-2.429 8.278.916 11.067c5.571 5.25 14.248 6.392 21.227 3.453c9.77-3.721 16.519-12.193 22.191-20.59c12.658-18.236 20.335-39.211 30.26-58.914z"/><path fill="#aea99f" d="M99.991 24.121C80.397 39.646 64.725 48.036 44.686 55.254c-6.048 2.588-12.53 5.872-15.339 12.222c-2.892 6.007-1.944 14.385 1.374 19.948c-.248-2.342 1.003-6.125 2.864-7.901c6.176-6.878 14.22-11.384 21.296-16.607l.017-.014l.017-.012C71.29 51.644 86.643 38.793 99.99 24.121z"/></svg>
React
import type { SVGProps } from "react";
export function DeviconThymeleaf(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#005f0f" d="M9.211 0H118.79a9.084 9.084 0 0 1 9.103 9.104v109.792A9.084 9.084 0 0 1 118.79 128H9.21a9.084 9.084 0 0 1-9.103-9.104V9.104A9.084 9.084 0 0 1 9.21 0z"/><path fill="#fff" d="M109.017 17.453C93.28 36.737 74.06 52.889 53.564 66.89c-6.663 4.77-14.018 9.015-19.141 15.546c-1.957 3.437-2.429 8.278.916 11.067c5.571 5.25 14.248 6.392 21.227 3.453c9.77-3.721 16.519-12.193 22.191-20.59c12.658-18.236 20.335-39.211 30.26-58.914z"/><path fill="#aea99f" d="M99.991 24.121C80.397 39.646 64.725 48.036 44.686 55.254c-6.048 2.588-12.53 5.872-15.339 12.222c-2.892 6.007-1.944 14.385 1.374 19.948c-.248-2.342 1.003-6.125 2.864-7.901c6.176-6.878 14.22-11.384 21.296-16.607l.017-.014l.017-.012C71.29 51.644 86.643 38.793 99.99 24.121z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#005f0f" d="M9.211 0H118.79a9.084 9.084 0 0 1 9.103 9.104v109.792A9.084 9.084 0 0 1 118.79 128H9.21a9.084 9.084 0 0 1-9.103-9.104V9.104A9.084 9.084 0 0 1 9.21 0z"/><path fill="#fff" d="M109.017 17.453C93.28 36.737 74.06 52.889 53.564 66.89c-6.663 4.77-14.018 9.015-19.141 15.546c-1.957 3.437-2.429 8.278.916 11.067c5.571 5.25 14.248 6.392 21.227 3.453c9.77-3.721 16.519-12.193 22.191-20.59c12.658-18.236 20.335-39.211 30.26-58.914z"/><path fill="#aea99f" d="M99.991 24.121C80.397 39.646 64.725 48.036 44.686 55.254c-6.048 2.588-12.53 5.872-15.339 12.222c-2.892 6.007-1.944 14.385 1.374 19.948c-.248-2.342 1.003-6.125 2.864-7.901c6.176-6.878 14.22-11.384 21.296-16.607l.017-.014l.017-.012C71.29 51.644 86.643 38.793 99.99 24.121z"/></svg> </template>
CSS
.icon-thymeleaf {
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%20128%20128%22%3E%3Cpath%20fill%3D%22%23005f0f%22%20d%3D%22M9.211%200H118.79a9.084%209.084%200%200%201%209.103%209.104v109.792A9.084%209.084%200%200%201%20118.79%20128H9.21a9.084%209.084%200%200%201-9.103-9.104V9.104A9.084%209.084%200%200%201%209.21%200z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M109.017%2017.453C93.28%2036.737%2074.06%2052.889%2053.564%2066.89c-6.663%204.77-14.018%209.015-19.141%2015.546c-1.957%203.437-2.429%208.278.916%2011.067c5.571%205.25%2014.248%206.392%2021.227%203.453c9.77-3.721%2016.519-12.193%2022.191-20.59c12.658-18.236%2020.335-39.211%2030.26-58.914z%22%2F%3E%3Cpath%20fill%3D%22%23aea99f%22%20d%3D%22M99.991%2024.121C80.397%2039.646%2064.725%2048.036%2044.686%2055.254c-6.048%202.588-12.53%205.872-15.339%2012.222c-2.892%206.007-1.944%2014.385%201.374%2019.948c-.248-2.342%201.003-6.125%202.864-7.901c6.176-6.878%2014.22-11.384%2021.296-16.607l.017-.014l.017-.012C71.29%2051.644%2086.643%2038.793%2099.99%2024.121z%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%20128%20128%22%3E%3Cpath%20fill%3D%22%23005f0f%22%20d%3D%22M9.211%200H118.79a9.084%209.084%200%200%201%209.103%209.104v109.792A9.084%209.084%200%200%201%20118.79%20128H9.21a9.084%209.084%200%200%201-9.103-9.104V9.104A9.084%209.084%200%200%201%209.21%200z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M109.017%2017.453C93.28%2036.737%2074.06%2052.889%2053.564%2066.89c-6.663%204.77-14.018%209.015-19.141%2015.546c-1.957%203.437-2.429%208.278.916%2011.067c5.571%205.25%2014.248%206.392%2021.227%203.453c9.77-3.721%2016.519-12.193%2022.191-20.59c12.658-18.236%2020.335-39.211%2030.26-58.914z%22%2F%3E%3Cpath%20fill%3D%22%23aea99f%22%20d%3D%22M99.991%2024.121C80.397%2039.646%2064.725%2048.036%2044.686%2055.254c-6.048%202.588-12.53%205.872-15.339%2012.222c-2.892%206.007-1.944%2014.385%201.374%2019.948c-.248-2.342%201.003-6.125%202.864-7.901c6.176-6.878%2014.22-11.384%2021.296-16.607l.017-.014l.017-.012C71.29%2051.644%2086.643%2038.793%2099.99%2024.121z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/devicon/thymeleaf.svg?color=%231a73e8&size=48
