Filtere Tools schnell nach Aufgabe und wechsle direkt in den passenden Ablauf.

Bilder, SVG & CSS

Bilder bearbeiten, Farben extrahieren, SVG optimieren, CSS-Visuals erzeugen und lokale Design-Assets erstellen.

34 Tools

Themencluster

Bilder, SVG & CSS

Bilder bearbeiten, Farben extrahieren, SVG optimieren, CSS-Visuals erzeugen und lokale Design-Assets erstellen.

Bild-Resizer

Skalieren Sie Bilder mit Breite/Höhe, Seitenverhältnis-Sperre, Fit-Modi und Format-Export.

Bild-Zuschneider

Schneiden Sie Bilder mit anpassbarem Bereich präzise zu und exportieren Sie den gewählten Ausschnitt.

SVG-Optimierer

Optimieren Sie SVG-Dateien, indem Sie Metadaten, Kommentare und überflüssige Attribute entfernen.

CSS-Gradient-Generator

Erstellen Sie lineare oder radiale Verlaeufe mit Winkel, Farb-Stopps und CSS-Export.

Ergänzende Leitfäden

Image optimization workflow

Prepare web images with sizing, compression, and delivery checks.

Color extraction from images

Use extracted colors as candidates for previews, accents, and documentation.

svg-optimization-and-conversion-best-practices

Image privacy and redaction

Remove sensitive regions before image assets leave the original context.

Common tasks

Use this hub for local image editing, SVG optimization, CSS asset generation, and visual review before publishing.

Resize, crop, and inspect images before using them in docs or social previews.
Redact sensitive visual regions before optimization or export.
Generate CSS and SVG assets with predictable dimensions and reusable output.

Related workflows

Bildgröße und Social-Export

Bilder lokal zuschneiden, optimieren und Social-Metadata-Assets vorbereiten.

Open workflow

Tutorials and checklists

Image optimization workflow

Prepare web images with sizing, compression, and delivery checks.

Image privacy and redaction

Remove sensitive regions before image assets leave the original context.

Color extraction from images

Use extracted colors as candidates for previews, accents, and documentation.

Category FAQ

Should I resize private screenshots before redaction?

No. Redact first, then resize and optimize the safe asset.

Which image tools are best for social previews?

Start with resizing and cropping, then generate or inspect Open Graph metadata with the final asset.

SVG-Optimierer

Optimieren Sie SVG-Dateien, indem Sie Metadaten, Kommentare und überflüssige Attribute entfernen.

Öffnen

Google-Fonts-Paarfinder

Finden Sie kontraststarke, produktionsreife Schriftkombinationen und kopieren Sie das CSS-Import-Snippet sofort.

Öffnen

Text-zu-Handschrift-Konverter

Rendern Sie getippten Text als handschriftähnliche Bilder mit herunterladbarer PNG-Ausgabe.

Öffnen

Code-zu-Bild-Konverter

Code-Snippets in herunterladbare PNG-Bilder umwandeln.

Öffnen

Farbkonverter

Konvertieren Sie Farben zwischen HEX-, RGB- und HSL-Formaten.

Öffnen

React-Native-Schatten-Generator

Optimieren Sie iOS-Schatteneigenschaften und Android-Elevation mit Live-Vorschau und kopierfertiger StyleSheet-Ausgabe.

Öffnen

AI-Farbpaletten-Generator

Erzeugen Sie markentaugliche Farbpaletten aus Basisfarbe und Stil-Keyword.

Öffnen

Farbmischer

Mischen Sie zwei Farben im RGB- oder HSL-Raum mit Verhaeltnisregler und CSS-Ausgabe.

Öffnen

Farbton-Stufen-Generator

Erzeugen Sie 10-12 Abstufungen aus einer Basisfarbe und exportieren Sie CSS-Variablen.

Öffnen

Bild-Durchschnittsfarbe-Finder

Lade ein Bild hoch, ermittle die Durchschnittsfarbe und kopiere HEX/RGB direkt.

Öffnen

Bild-Caption-Generator

Fügen Sie Bildern Text-Captions hinzu, passen Sie Position/Outline an und exportieren Sie als PNG.

Öffnen

Bild-Farbextraktor

Extrahiere dominante Farben aus Bildern und kopiere die HEX-Werte sofort.

Öffnen

Bild-Farbpicker

Klicken Sie auf einen beliebigen Punkt im Bild, um exakte HEX/RGB-Farbwerte zu erfassen und zu kopieren.

Öffnen

Bild-Zuschneider

Schneiden Sie Bilder mit anpassbarem Bereich präzise zu und exportieren Sie den gewählten Ausschnitt.

Öffnen

Bildfilter

Wenden Sie anpassbare Helligkeit, Kontrast, Sättigung, Graustufen und Weichzeichnung auf Bilder an.

Öffnen

Bild-Resizer

Skalieren Sie Bilder mit Breite/Höhe, Seitenverhältnis-Sperre, Fit-Modi und Format-Export.

Öffnen

Foto-Zensur

Maskieren Sie sensible Bildbereiche mit anpassbarer Verpixelung oder Unschärfe.

Öffnen

Scan-PDF-Konverter

Verbessern Sie gescannte Seiten mit Kontrast- und Schwellenwert-Reglern und exportieren Sie sie als ein PDF.

Öffnen

SVG-Blob-Generator

Erzeugen Sie organische SVG-Blob-Formen mit einstellbaren Punkten, Zufall und Seed.

Öffnen

SVG-Muster-Generator

Erstellen Sie nahtlose SVG-Muster mit anpassbarem Abstand, Strichstärke und Farbpresets.

Öffnen

SVG Kontur-zu-Fläche Konverter

Wandeln Sie SVG-Elemente mit Kontur in flächenbasierte Formen mit Live-Vorschau um.

Öffnen

SVG-zu-PNG-Konverter

Wandeln Sie SVG-Markup mit eigener Auflösung und transparentem Hintergrund in hochwertiges PNG um.

Öffnen

CSS-Hintergrundmuster-Generator

Erstellen Sie wiederholbare CSS-Hintergrundtexturen mit Presets, Reglern und kopierfertigem Code.

Öffnen

CSS-Border-Radius-Generator

Passen Sie jeden Eckenradius visuell an und exportieren Sie saubere CSS border-radius-Werte.

Öffnen

CSS-Box-Shadow-Generator

Erstellen Sie ein- oder mehrlagige CSS-Schatten mit Live-Vorschau und herunterladbaren Snippets.

Öffnen

CSS-Checkbox-Generator

Erzeugen Sie benutzerdefinierte Checkbox-Styles mit CSS-Ausgabe für Hover/Checked-Zustaende.

Öffnen

CSS-Clip-Path-Generator

Erstellen Sie clip-path-Polygone mit Presets, eigenen Punkten und Live-Vorschau.

Öffnen

CSS-Cubic-Bezier-Generator

Visualisieren und exportieren Sie Easing-Kurven für sanfte CSS-Übergänge.

Öffnen

CSS-Glassmorphism-Generator

Erzeugen Sie Frostglas-Styles mit Blur, Transparenz, Rahmen und Schatten als sauberes CSS.

Öffnen

CSS-Gradient-Generator

Erstellen Sie lineare oder radiale Verlaeufe mit Winkel, Farb-Stopps und CSS-Export.

Öffnen

CSS-Loader-Generator

Erzeugen Sie Spinner-, Dots- oder Bars-Loader mit einstellbarer Größe, Tempo und CSS-Export.

Öffnen

CSS-Switch-Generator

Erzeugen Sie saubere Toggle-Switch-Styles mit einstellbarer Größe, Farbe und Zustand.

Öffnen

CSS-Text-Glitch-Generator

Erstellen Sie animierte Glitch-Text-Effekte mit Intensität, Farben und CSS-Export.

Öffnen

CSS-Dreieck-Generator

Erzeugen Sie CSS-Dreiecke mit Richtung, Groesse und Farbe fuer Tooltips und Pfeile.

Öffnen