module-debug

Introduced in v5.0.0

Module Menu Preview

module-debug module-debug module-debug module-debug module-debug

Usage

Icon Identifier

module-debug

Markup

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M46.1 38H50c1.1 0 2-.9 2-2s-.9-2-2-2h-3.9v-4H50c1.1 0 2-.9 2-2s-.9-2-2-2h-4.6a12.054 12.054 0 0 0-7.28-7.29l1.71-3.84c.45-1.01 0-2.19-1.01-2.64-1.01-.45-2.19 0-2.64 1.01L34.06 18h-4.08l-2.14-4.81c-.45-1.01-1.63-1.46-2.64-1.01-1.01.45-1.46 1.63-1.01 2.64l1.73 3.89c-3.4 1.21-6.09 3.9-7.3 7.3h-4.6c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v4h-3.9c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v2c0 .68.07 1.35.18 2h-4.08c-1.1 0-2 .9-2 2s.9 2 2 2h5.52c2.08 3.58 5.95 6 10.38 6h4.2c4.43 0 8.3-2.42 10.38-6h5.43c1.1 0 2-.9 2-2s-.9-2-2-2h-3.98c.11-.65.18-1.32.18-2v-2Zm-12 10h-4.2c-4.41 0-8-3.59-8-8V30c0-4.41 3.59-8 8-8h4.2c4.41 0 8 3.59 8 8v10c0 4.41-3.59 8-8 8Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M34.1 48c4.41 0 8-3.59 8-8V30c0-4.41-3.59-8-8-8H32v26h2.1Z"/></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="M46.1 38H50c1.1 0 2-.9 2-2s-.9-2-2-2h-3.9v-4H50c1.1 0 2-.9 2-2s-.9-2-2-2h-4.6a12.054 12.054 0 0 0-7.28-7.29l1.71-3.84c.45-1.01 0-2.19-1.01-2.64-1.01-.45-2.19 0-2.64 1.01L34.06 18h-4.08l-2.14-4.81c-.45-1.01-1.63-1.46-2.64-1.01-1.01.45-1.46 1.63-1.01 2.64l1.73 3.89c-3.4 1.21-6.09 3.9-7.3 7.3h-4.6c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v4h-3.9c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v2c0 .68.07 1.35.18 2h-4.08c-1.1 0-2 .9-2 2s.9 2 2 2h5.52c2.08 3.58 5.95 6 10.38 6h4.2c4.43 0 8.3-2.42 10.38-6h5.43c1.1 0 2-.9 2-2s-.9-2-2-2h-3.98c.11-.65.18-1.32.18-2v-2Zm-12 10h-4.2c-4.41 0-8-3.59-8-8V30c0-4.41 3.59-8 8-8h4.2c4.41 0 8 3.59 8 8v10c0 4.41-3.59 8-8 8Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M34.1 48c4.41 0 8-3.59 8-8V30c0-4.41-3.59-8-8-8H32v26h2.1Z"/></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=1769809642593#module-debug" /></svg>
    </span>
</span>

TYPO3 ViewHelper

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

TYPO3 Web Component

<typo3-backend-icon identifier="module-debug" 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='M46.1 38H50c1.1 0 2-.9 2-2s-.9-2-2-2h-3.9v-4H50c1.1 0 2-.9 2-2s-.9-2-2-2h-4.6a12.054 12.054 0 0 0-7.28-7.29l1.71-3.84c.45-1.01 0-2.19-1.01-2.64-1.01-.45-2.19 0-2.64 1.01L34.06 18h-4.08l-2.14-4.81c-.45-1.01-1.63-1.46-2.64-1.01-1.01.45-1.46 1.63-1.01 2.64l1.73 3.89c-3.4 1.21-6.09 3.9-7.3 7.3h-4.6c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v4h-3.9c-1.1 0-2 .9-2 2s.9 2 2 2h3.9v2c0 .68.07 1.35.18 2h-4.08c-1.1 0-2 .9-2 2s.9 2 2 2h5.52c2.08 3.58 5.95 6 10.38 6h4.2c4.43 0 8.3-2.42 10.38-6h5.43c1.1 0 2-.9 2-2s-.9-2-2-2h-3.98c.11-.65.18-1.32.18-2v-2Zm-12 10h-4.2c-4.41 0-8-3.59-8-8V30c0-4.41 3.59-8 8-8h4.2c4.41 0 8 3.59 8 8v10c0 4.41-3.59 8-8 8Z'/%3e%3cpath fill='var(--icon-color-accent, %23ff8700)' d='M34.1 48c4.41 0 8-3.59 8-8V30c0-4.41-3.59-8-8-8H32v26h2.1Z'/%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-debug;
}

Download

Download