module-install

Introduced in v1.0.0
Available in TYPO3 7.6 8.6 9.5 10.4 11.5 12.4 13.x

Module Menu Preview

Usage

Icon Identifier

module-install

Markup

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M36 43c-.53 0-1.04-.21-1.41-.59l-4-4c-.78-.78-.78-2.05 0-2.83s2.05-.78 2.83 0l2.37 2.37 4.62-6.16c.66-.88 1.92-1.06 2.8-.4.88.66 1.06 1.92.4 2.8l-6 8c-.35.46-.88.75-1.46.79h-.14Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M22 37c0-2.14.46-4.17 1.27-6.02-.1-.08-.19-.17-.29-.26-1.01-1.03-1.52-2.27-1.52-3.72s.51-2.69 1.52-3.72c1.01-1.03 2.26-1.54 3.74-1.54s2.69.51 3.72 1.54c.05.05.09.12.14.17 1.95-.93 4.12-1.46 6.42-1.46 1.48 0 2.91.22 4.26.62 0-.24-.05-.48-.18-.71l-2.8-4.84c-.38-.65-1.19-.93-1.88-.63l-3.25 1.37c-.28-.2-.56-.39-.84-.56-.29-.18-.59-.33-.92-.45l-.44-3.49c-.09-.75-.73-1.32-1.49-1.32h-5.61c-.76 0-1.4.56-1.49 1.32l-.44 3.49c-.3.12-.6.28-.9.45-.3.18-.59.36-.86.56l-3.25-1.37c-.7-.29-1.5-.02-1.88.63l-2.8 4.84c-.38.66-.21 1.49.39 1.95l2.81 2.13a3 3 0 0 0-.04.51v1.01c0 .16.01.33.04.51l-2.81 2.13c-.6.46-.77 1.29-.39 1.95l2.8 4.84c.38.65 1.19.93 1.88.63l3.25-1.37c.28.2.56.39.84.56.29.18.59.33.92.45l.44 3.49c.03.28.16.51.32.71-.43-1.4-.67-2.89-.67-4.43Z"/><path fill="currentColor" d="M37 26c6.07 0 11 4.93 11 11s-4.93 11-11 11-11-4.93-11-11 4.93-11 11-11m0-4c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Z"/></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="currentColor" d="M36 43c-.53 0-1.04-.21-1.41-.59l-4-4c-.78-.78-.78-2.05 0-2.83s2.05-.78 2.83 0l2.37 2.37 4.62-6.16c.66-.88 1.92-1.06 2.8-.4.88.66 1.06 1.92.4 2.8l-6 8c-.35.46-.88.75-1.46.79h-.14Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M22 37c0-2.14.46-4.17 1.27-6.02-.1-.08-.19-.17-.29-.26-1.01-1.03-1.52-2.27-1.52-3.72s.51-2.69 1.52-3.72c1.01-1.03 2.26-1.54 3.74-1.54s2.69.51 3.72 1.54c.05.05.09.12.14.17 1.95-.93 4.12-1.46 6.42-1.46 1.48 0 2.91.22 4.26.62 0-.24-.05-.48-.18-.71l-2.8-4.84c-.38-.65-1.19-.93-1.88-.63l-3.25 1.37c-.28-.2-.56-.39-.84-.56-.29-.18-.59-.33-.92-.45l-.44-3.49c-.09-.75-.73-1.32-1.49-1.32h-5.61c-.76 0-1.4.56-1.49 1.32l-.44 3.49c-.3.12-.6.28-.9.45-.3.18-.59.36-.86.56l-3.25-1.37c-.7-.29-1.5-.02-1.88.63l-2.8 4.84c-.38.66-.21 1.49.39 1.95l2.81 2.13a3 3 0 0 0-.04.51v1.01c0 .16.01.33.04.51l-2.81 2.13c-.6.46-.77 1.29-.39 1.95l2.8 4.84c.38.65 1.19.93 1.88.63l3.25-1.37c.28.2.56.39.84.56.29.18.59.33.92.45l.44 3.49c.03.28.16.51.32.71-.43-1.4-.67-2.89-.67-4.43Z"/><path fill="currentColor" d="M37 26c6.07 0 11 4.93 11 11s-4.93 11-11 11-11-4.93-11-11 4.93-11 11-11m0-4c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Z"/></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?v=1772004282855#module-install" /></svg>
    </span>
</span>

TYPO3 ViewHelper

<core:icon identifier="module-install" size="small" />

TYPO3 Web Component

<typo3-backend-icon identifier="module-install" size="small"></typo3-backend-icon>

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='%23fff' d='M36 43c-.53 0-1.04-.21-1.41-.59l-4-4c-.78-.78-.78-2.05 0-2.83s2.05-.78 2.83 0l2.37 2.37 4.62-6.16c.66-.88 1.92-1.06 2.8-.4.88.66 1.06 1.92.4 2.8l-6 8c-.35.46-.88.75-1.46.79h-.14Z'/%3e%3cpath fill='var(--icon-color-accent, %23ff8700)' d='M22 37c0-2.14.46-4.17 1.27-6.02-.1-.08-.19-.17-.29-.26-1.01-1.03-1.52-2.27-1.52-3.72s.51-2.69 1.52-3.72c1.01-1.03 2.26-1.54 3.74-1.54s2.69.51 3.72 1.54c.05.05.09.12.14.17 1.95-.93 4.12-1.46 6.42-1.46 1.48 0 2.91.22 4.26.62 0-.24-.05-.48-.18-.71l-2.8-4.84c-.38-.65-1.19-.93-1.88-.63l-3.25 1.37c-.28-.2-.56-.39-.84-.56-.29-.18-.59-.33-.92-.45l-.44-3.49c-.09-.75-.73-1.32-1.49-1.32h-5.61c-.76 0-1.4.56-1.49 1.32l-.44 3.49c-.3.12-.6.28-.9.45-.3.18-.59.36-.86.56l-3.25-1.37c-.7-.29-1.5-.02-1.88.63l-2.8 4.84c-.38.66-.21 1.49.39 1.95l2.81 2.13a3 3 0 0 0-.04.51v1.01c0 .16.01.33.04.51l-2.81 2.13c-.6.46-.77 1.29-.39 1.95l2.8 4.84c.38.65 1.19.93 1.88.63l3.25-1.37c.28.2.56.39.84.56.29.18.59.33.92.45l.44 3.49c.03.28.16.51.32.71-.43-1.4-.67-2.89-.67-4.43Z'/%3e%3cpath fill='%23fff' d='M37 26c6.07 0 11 4.93 11 11s-4.93 11-11 11-11-4.93-11-11 4.93-11 11-11m0-4c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Z'/%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-install;
}

Download

Download