module-seo

Introduced in v1.8.0
Available in TYPO3 9.5 10.4 11.5 12.4 13.x

Module Menu Preview

Usage

Icon Identifier

module-seo

Markup

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="m51.41 48.59-5.64-5.64c1.4-1.96 2.22-4.35 2.22-6.94 0-6.63-5.37-12-12-12s-12 5.37-12 12 5.37 12 12 12c2.59 0 4.99-.83 6.95-2.23l5.64 5.64c.39.39.9.59 1.41.59s1.02-.2 1.41-.59c.78-.78.78-2.05 0-2.83ZM28 36c0-4.41 3.59-8 8-8s8 3.59 8 8-3.59 8-8 8-8-3.59-8-8Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M24 36c0-1.25.19-2.45.55-3.58-.19-.14-.37-.29-.55-.46-1.11-1.09-1.66-2.41-1.66-3.96s.55-2.87 1.66-3.96c1.11-1.09 2.47-1.64 4.09-1.64s2.94.55 4.06 1.64c.15.15.27.31.4.47a11.921 11.921 0 0 1 9.47 1.12l1.33-.98c.66-.49.85-1.38.43-2.08l-3.07-5.16c-.41-.7-1.3-.99-2.06-.67l-3.55 1.45c-.3-.21-.61-.41-.92-.6-.31-.19-.65-.35-1.01-.48l-.48-3.72c-.1-.8-.8-1.4-1.63-1.4h-6.13c-.83 0-1.53.6-1.63 1.4l-.48 3.72c-.33.13-.66.29-.99.48-.33.19-.64.39-.94.6l-3.55-1.45c-.76-.31-1.64-.02-2.06.67l-3.07 5.16c-.42.7-.23 1.59.43 2.08l3.07 2.27c-.03.19-.04.37-.04.54v1.08c0 .17.01.35.04.54l-3.07 2.27c-.66.49-.85 1.38-.43 2.08l3.07 5.16c.41.7 1.3.99 2.06.67l3.55-1.45c.3.21.61.41.92.6.31.19.65.35 1.01.48l.48 3.72c.1.8.8 1.4 1.63 1.4h2.14a11.95 11.95 0 0 1-3.07-8Z"/></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="m51.41 48.59-5.64-5.64c1.4-1.96 2.22-4.35 2.22-6.94 0-6.63-5.37-12-12-12s-12 5.37-12 12 5.37 12 12 12c2.59 0 4.99-.83 6.95-2.23l5.64 5.64c.39.39.9.59 1.41.59s1.02-.2 1.41-.59c.78-.78.78-2.05 0-2.83ZM28 36c0-4.41 3.59-8 8-8s8 3.59 8 8-3.59 8-8 8-8-3.59-8-8Z"/><path fill="var(--icon-color-accent, #ff8700)" d="M24 36c0-1.25.19-2.45.55-3.58-.19-.14-.37-.29-.55-.46-1.11-1.09-1.66-2.41-1.66-3.96s.55-2.87 1.66-3.96c1.11-1.09 2.47-1.64 4.09-1.64s2.94.55 4.06 1.64c.15.15.27.31.4.47a11.921 11.921 0 0 1 9.47 1.12l1.33-.98c.66-.49.85-1.38.43-2.08l-3.07-5.16c-.41-.7-1.3-.99-2.06-.67l-3.55 1.45c-.3-.21-.61-.41-.92-.6-.31-.19-.65-.35-1.01-.48l-.48-3.72c-.1-.8-.8-1.4-1.63-1.4h-6.13c-.83 0-1.53.6-1.63 1.4l-.48 3.72c-.33.13-.66.29-.99.48-.33.19-.64.39-.94.6l-3.55-1.45c-.76-.31-1.64-.02-2.06.67l-3.07 5.16c-.42.7-.23 1.59.43 2.08l3.07 2.27c-.03.19-.04.37-.04.54v1.08c0 .17.01.35.04.54l-3.07 2.27c-.66.49-.85 1.38-.43 2.08l3.07 5.16c.41.7 1.3.99 2.06.67l3.55-1.45c.3.21.61.41.92.6.31.19.65.35 1.01.48l.48 3.72c.1.8.8 1.4 1.63 1.4h2.14a11.95 11.95 0 0 1-3.07-8Z"/></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-seo" /></svg>
    </span>
</span>

TYPO3 ViewHelper

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

TYPO3 Web Component

<typo3-backend-icon identifier="module-seo" 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='m51.41 48.59-5.64-5.64c1.4-1.96 2.22-4.35 2.22-6.94 0-6.63-5.37-12-12-12s-12 5.37-12 12 5.37 12 12 12c2.59 0 4.99-.83 6.95-2.23l5.64 5.64c.39.39.9.59 1.41.59s1.02-.2 1.41-.59c.78-.78.78-2.05 0-2.83ZM28 36c0-4.41 3.59-8 8-8s8 3.59 8 8-3.59 8-8 8-8-3.59-8-8Z'/%3e%3cpath fill='var(--icon-color-accent, %23ff8700)' d='M24 36c0-1.25.19-2.45.55-3.58-.19-.14-.37-.29-.55-.46-1.11-1.09-1.66-2.41-1.66-3.96s.55-2.87 1.66-3.96c1.11-1.09 2.47-1.64 4.09-1.64s2.94.55 4.06 1.64c.15.15.27.31.4.47a11.921 11.921 0 0 1 9.47 1.12l1.33-.98c.66-.49.85-1.38.43-2.08l-3.07-5.16c-.41-.7-1.3-.99-2.06-.67l-3.55 1.45c-.3-.21-.61-.41-.92-.6-.31-.19-.65-.35-1.01-.48l-.48-3.72c-.1-.8-.8-1.4-1.63-1.4h-6.13c-.83 0-1.53.6-1.63 1.4l-.48 3.72c-.33.13-.66.29-.99.48-.33.19-.64.39-.94.6l-3.55-1.45c-.76-.31-1.64-.02-2.06.67l-3.07 5.16c-.42.7-.23 1.59.43 2.08l3.07 2.27c-.03.19-.04.37-.04.54v1.08c0 .17.01.35.04.54l-3.07 2.27c-.66.49-.85 1.38-.43 2.08l3.07 5.16c.41.7 1.3.99 2.06.67l3.55-1.45c.3.21.61.41.92.6.31.19.65.35 1.01.48l.48 3.72c.1.8.8 1.4 1.63 1.4h2.14a11.95 11.95 0 0 1-3.07-8Z'/%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-seo;
}

Download

Download