devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt

Kostenlose Häkchen-Icons (SVG)

48 kostenlose Häkchen-Icons aus Open-Source-Sets – klicke auf eines, um Größe, Farbe und Strichstärke anzupassen, und kopiere es als SVG, JSX, Data-URI oder CSS.

Aktualisiert am

check
Lucidecheck
Tablercheck
Heroiconscheck
Phosphorcheck
Bootstrap Iconscheck
Iconoircheck-20-filled
Fluent UIcheck
Material Symbolscheck
Material Design Iconscheck-line
Lucidecheck-filled
Tablercheck-16-solid
Heroiconscheck-bold
Phosphorcheck-lg
Bootstrap Iconspc-check
Iconoircheck-20-regular
Fluent UIcheck-rounded
Material Symbolscheck-bold
Material Design Iconseye-check
Tablercheck-20-solid
Heroiconscheck-duotone
Phosphorbag-check
Bootstrap Iconscheck-24-filled
Fluent UIcheck-box
Material Symbolscheck-outline
Material Design Iconsmap-check
Tablercheck-solid
Heroiconscheck-fill
Phosphorbag-check-fill
Bootstrap Iconscheck-24-regular
Fluent UIcheck-box-outline
Material Symbolscheckbox-outline
Material Design Iconsbell-check
Tablercheck-light
Phosphorcheck-all
Bootstrap Iconscheck-box-outline-rounded
Material Symbolsbug-check
Material Design Iconscopy-check
Tablercheck-thin
Phosphorcheck-box-outline-sharp
Material Symbolsbug-check-outline
Material Design Iconscopy-check-filled
Tablercheck-fat
Phosphorcheck-box-rounded
Material Symbolscheck-all
Material Design Iconsfile-check
Tablercheck-fat-bold
Phosphorcheck-box-sharp
Material Symbols

Häkchen-Icons verwenden

Haken bestätigen Erfolg, ausgewählte Optionen und abgeschlossene Schritte; ein Haken im Kreis wirkt wie ein stärkeres „erledigt“.

Alle Icons hier folgen currentColor, sie übernehmen also die Textfarbe des Elements, in dem sie stehen – ein SVG funktioniert auf hellen und dunklen Hintergründen, in Links und in Buttons. Setze eine feste width und height (oder passe die Größe per CSS mit 1em an), damit das Layout beim Laden der Seite nicht springt.

Barrierefreie Icons

Wenn das Icon dekorativ ist oder neben sichtbarem Text steht, füge aria-hidden="true" hinzu. Ist es der einzige Inhalt eines Buttons oder Links, gib diesem Element ein aria-label wie „Prüfen“.

Lizenzen

Diese Häkchen-Icons stammen aus Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, Iconoir, Fluent UI, Material Symbols, Material Design Icons – Open-Source-Sets unter MIT-, ISC- oder Apache-2.0-Lizenz, die persönliche und kommerzielle Nutzung erlauben. Brauchst du etwas anderes? Durchsuche alle 70.000+ Icons im SVG Icon Finder.

Häufige Fragen

Sind diese Häkchen-Icons auch kommerziell kostenlos nutzbar?
Ja. Sie stammen aus Open-Source-Icon-Sets unter MIT-, ISC- oder Apache-2.0-Lizenz, die kommerzielle Nutzung erlauben. Behalte den Lizenzhinweis bei, wenn du die Icon-Dateien selbst weitergibst.
Wie ändere ich die Farbe eines Häkchen-Icons?
Die SVGs nutzen currentColor, also setze die CSS-color des übergeordneten Elements – oder öffne das Icon im Finder und wähle vor dem Kopieren eine feste Farbe.
Kann ich diese Icons in Webflow oder React verwenden?
Ja. Öffne ein Icon und nutze Copy to Webflow (fügt ein Code Embed ein) oder Copy JSX für eine React-Komponente.