module-lang
Introduced in v1.0.0
Available in TYPO3
7.6 8.6 9.5 10.4 11.5
Usage
Markup
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#632F5F" d="M0 0h64v64H0z"/><path fill="#FFF" d="M32 18c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14m0-2c-8.822 0-16 7.178-16 16s7.178 16 16 16 16-7.178 16-16-7.178-16-16-16z"/><path fill="#FFF" d="M46 30.756c-.44-4.728-3.204-8.786-7.09-10.96-.184.194-.234.08-.234.274-.554.194-1.292-.194-1.846-.388a6.46 6.46 0 0 0-4.244-.194c-.554.194-1.844.388-1.292 1.552.368.584 1.29 1.166 2.214.39.368-.388.74-.97 1.29-.388.186.196.186.39.186.584-.186.58-.74.776-1.292.776-.74.194-1.48 0-2.216.194-.74.194-1.846.388-1.846 1.36 0 1.16-.37 1.356-1.294 1.55-.74 0-1.106.388-.74 1.164.186.58.74.58 1.11.388 1.476-.776 2.768-2.716 4.428-.388l.368-.194c.37-1.552.74-.58 1.108 0l.554.58c2.214-2.132 1.66.972 2.4 1.552-1.48-.388-3.14 1.164-4.43.194-2.214-1.744-3.69-.968-5.72.776-1.66 1.36-2.03 3.104-1.66 4.656.552 1.94 2.58 2.134 4.244 1.746.552-.196 1.66-.196 1.66.192-.37 1.746 1.66 2.91.92 4.848-.552 1.552.372 3.492 1.66 4.074 1.294.58 2.4-.97 2.956-2.328.184-.194 0-.58.184-.776 1.476-1.94 1.292-4.848 3.136-6.788.554-.58 2.4-2.714.92-4.46 3.508-.97 2.22 2.52 2.956 4.074.552-1.164.92-2.328 1.29-3.3.184-.58.32-.76.32-.76zM25.825 20.42c.58-.612.606-.712 1.188-1.53-1.218.428-2.748 1.276-3.846 2.198l.336.354h1.746s.194 0 .194-.2l.194-.206s.194 0 .194-.204l.192-.204.194-.206c-.58.41-.58.206-.388 0 0 .206 0 .206 0 0 0 .206 0 0 0 0l-.004-.002zM23.238 39.3s-.192-.184 0 0c-.192-.184-.192-.184 0 0v-.552l-.192-.184c-.19 0-.19-.186-.38-.186s-.38-.186-.572-.186h-.382s-.19 0-.19-.184c-1.336-.74-1.906-2.03-2.288-3.504 0-.37-.19-.74-.19-1.108-.188-.186-.188-.37-.38-.556-.38-.368-.188-1.106.192-1.844v-.368c0-.186 0-.186.19-.37 0-.18 0-.18.192-.366.38-.74 1.144-1.292 1.524-1.846.19-.184.19-.184.19-.368v-.184c.19-.184.19-.554.38-.74 0-.18.192-.552.192-.736 0-.37 0-.554-.192-.92-.192-.556-.308-1.036-.688-1.406-1.716 2.4-2.74 5.092-2.74 8.226 0 4.246 1.806 8.012 4.828 10.648 0 0 .122.052.122-.128v-.188c0-.184.19-.184.19-.368.192-.74.192-1.844.192-2.58l.002-.002z"/></svg>Inline
<span class="icon icon-size-small icon-state-default">
<span class="icon-markup">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#632F5F" d="M0 0h64v64H0z"/><path fill="#FFF" d="M32 18c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14m0-2c-8.822 0-16 7.178-16 16s7.178 16 16 16 16-7.178 16-16-7.178-16-16-16z"/><path fill="#FFF" d="M46 30.756c-.44-4.728-3.204-8.786-7.09-10.96-.184.194-.234.08-.234.274-.554.194-1.292-.194-1.846-.388a6.46 6.46 0 0 0-4.244-.194c-.554.194-1.844.388-1.292 1.552.368.584 1.29 1.166 2.214.39.368-.388.74-.97 1.29-.388.186.196.186.39.186.584-.186.58-.74.776-1.292.776-.74.194-1.48 0-2.216.194-.74.194-1.846.388-1.846 1.36 0 1.16-.37 1.356-1.294 1.55-.74 0-1.106.388-.74 1.164.186.58.74.58 1.11.388 1.476-.776 2.768-2.716 4.428-.388l.368-.194c.37-1.552.74-.58 1.108 0l.554.58c2.214-2.132 1.66.972 2.4 1.552-1.48-.388-3.14 1.164-4.43.194-2.214-1.744-3.69-.968-5.72.776-1.66 1.36-2.03 3.104-1.66 4.656.552 1.94 2.58 2.134 4.244 1.746.552-.196 1.66-.196 1.66.192-.37 1.746 1.66 2.91.92 4.848-.552 1.552.372 3.492 1.66 4.074 1.294.58 2.4-.97 2.956-2.328.184-.194 0-.58.184-.776 1.476-1.94 1.292-4.848 3.136-6.788.554-.58 2.4-2.714.92-4.46 3.508-.97 2.22 2.52 2.956 4.074.552-1.164.92-2.328 1.29-3.3.184-.58.32-.76.32-.76zM25.825 20.42c.58-.612.606-.712 1.188-1.53-1.218.428-2.748 1.276-3.846 2.198l.336.354h1.746s.194 0 .194-.2l.194-.206s.194 0 .194-.204l.192-.204.194-.206c-.58.41-.58.206-.388 0 0 .206 0 .206 0 0 0 .206 0 0 0 0l-.004-.002zM23.238 39.3s-.192-.184 0 0c-.192-.184-.192-.184 0 0v-.552l-.192-.184c-.19 0-.19-.186-.38-.186s-.38-.186-.572-.186h-.382s-.19 0-.19-.184c-1.336-.74-1.906-2.03-2.288-3.504 0-.37-.19-.74-.19-1.108-.188-.186-.188-.37-.38-.556-.38-.368-.188-1.106.192-1.844v-.368c0-.186 0-.186.19-.37 0-.18 0-.18.192-.366.38-.74 1.144-1.292 1.524-1.846.19-.184.19-.184.19-.368v-.184c.19-.184.19-.554.38-.74 0-.18.192-.552.192-.736 0-.37 0-.554-.192-.92-.192-.556-.308-1.036-.688-1.406-1.716 2.4-2.74 5.092-2.74 8.226 0 4.246 1.806 8.012 4.828 10.648 0 0 .122.052.122-.128v-.188c0-.184.19-.184.19-.368.192-.74.192-1.844.192-2.58l.002-.002z"/></svg>
</span>
</span>Sprite
<span class="icon icon-size-small icon-state-default">
<span class="icon-markup">
<svg role="img"><use xlink:href="dist/sprites/module.svg#module-lang" /></svg>
</span>
</span>TYPO3 ViewHelper
<core:icon identifier="module-lang" size="small" />CSS Background Image
.myclass {
background-size: 1em 1em;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3e%3cpath fill='%23632F5F' d='M0 0h64v64H0z'/%3e%3cpath fill='%23FFF' d='M32 18c7.732 0 14 6.268 14 14s-6.268 14-14 14-14-6.268-14-14 6.268-14 14-14m0-2c-8.822 0-16 7.178-16 16s7.178 16 16 16 16-7.178 16-16-7.178-16-16-16z'/%3e%3cpath fill='%23FFF' d='M46 30.756c-.44-4.728-3.204-8.786-7.09-10.96-.184.194-.234.08-.234.274-.554.194-1.292-.194-1.846-.388a6.46 6.46 0 0 0-4.244-.194c-.554.194-1.844.388-1.292 1.552.368.584 1.29 1.166 2.214.39.368-.388.74-.97 1.29-.388.186.196.186.39.186.584-.186.58-.74.776-1.292.776-.74.194-1.48 0-2.216.194-.74.194-1.846.388-1.846 1.36 0 1.16-.37 1.356-1.294 1.55-.74 0-1.106.388-.74 1.164.186.58.74.58 1.11.388 1.476-.776 2.768-2.716 4.428-.388l.368-.194c.37-1.552.74-.58 1.108 0l.554.58c2.214-2.132 1.66.972 2.4 1.552-1.48-.388-3.14 1.164-4.43.194-2.214-1.744-3.69-.968-5.72.776-1.66 1.36-2.03 3.104-1.66 4.656.552 1.94 2.58 2.134 4.244 1.746.552-.196 1.66-.196 1.66.192-.37 1.746 1.66 2.91.92 4.848-.552 1.552.372 3.492 1.66 4.074 1.294.58 2.4-.97 2.956-2.328.184-.194 0-.58.184-.776 1.476-1.94 1.292-4.848 3.136-6.788.554-.58 2.4-2.714.92-4.46 3.508-.97 2.22 2.52 2.956 4.074.552-1.164.92-2.328 1.29-3.3.184-.58.32-.76.32-.76zM25.825 20.42c.58-.612.606-.712 1.188-1.53-1.218.428-2.748 1.276-3.846 2.198l.336.354h1.746s.194 0 .194-.2l.194-.206s.194 0 .194-.204l.192-.204.194-.206c-.58.41-.58.206-.388 0 0 .206 0 .206 0 0 0 .206 0 0 0 0l-.004-.002zM23.238 39.3s-.192-.184 0 0c-.192-.184-.192-.184 0 0v-.552l-.192-.184c-.19 0-.19-.186-.38-.186s-.38-.186-.572-.186h-.382s-.19 0-.19-.184c-1.336-.74-1.906-2.03-2.288-3.504 0-.37-.19-.74-.19-1.108-.188-.186-.188-.37-.38-.556-.38-.368-.188-1.106.192-1.844v-.368c0-.186 0-.186.19-.37 0-.18 0-.18.192-.366.38-.74 1.144-1.292 1.524-1.846.19-.184.19-.184.19-.368v-.184c.19-.184.19-.554.38-.74 0-.18.192-.552.192-.736 0-.37 0-.554-.192-.92-.192-.556-.308-1.036-.688-1.406-1.716 2.4-2.74 5.092-2.74 8.226 0 4.246 1.806 8.012 4.828 10.648 0 0 .122.052.122-.128v-.188c0-.184.19-.184.19-.368.192-.74.192-1.844.192-2.58l.002-.002z'/%3e%3c/svg%3e");
}Sass Background Variable
@import "@typo3/icons/dist/icons.scss";
@import "@typo3/icons/dist/scss/icons-variables-module.scss";
.myclass {
background-size: 1em 1em;
background-image: $icon-module-lang;
}