StartseiteWerkzeugeKategorien🎵 Audio🎬 Video🖼️ Bild & Farbe📄 Dokumente🔁 Dokument-Konvertierung📊 Diagramme💻 Entwicklung🧰 Alltag📝 Text🔢 Zahlen🔐 Verschlüsselung & Sicherheit📐 Einheiten🎙️ Medien & Aufnahme🌐 Webmaster & SEO💶 Rechner & Finanzen🧮 Rechner & Mathematik📕 PDF🩺 Gesundheit🎲 Spiele & SpaßPreise
🔒Datenschutz zuerst · Die gesamte Verarbeitung läuft in Ihrem Browser. Ihre Dateien und Texte werden nicht an uns übertragen.

HTML-Vorschau verwenden

🔒Datenschutz zuerst · Dieses Werkzeug arbeitet in Ihrem Browser. Die verwendeten Dateien und Texte laufen nicht über unsere Server.

Wofür HTML-Vorschau gedacht ist

Einen HTML-Schnipsel schnell sehen, ohne gleich eine Datei anzulegen? Der Code wird hier in einer sandboxed Umgebung gerendert – live, während Sie tippen, auf Wunsch halb Quellcode, halb Vorschau. Fremder Code kommt dabei nicht an Ihre echte Seite.

Bedienung

  1. Den HTML-Code in das Feld schreiben
  2. Die gewünschte Ansicht wählen
  3. Die Vorschau direkt betrachten

Typische Anwendungen: HTML-Schnipsel testen, Layout-Entwürfe ansehen, Fehler im Markup erkennen.

Fragen und Antworten

Warum ein sandboxed iframe?

So wird verhindert, dass fremder Code auf Ihre aktuelle Seite oder Daten zugreift. Die Vorschau ist dadurch isoliert und sicher.

Warum werden keine Skripte ausgeführt?

Aus Sicherheitsgründen ist die Sandbox ohne Script-Freigabe. Statisches HTML und CSS werden ganz normal dargestellt.

Funktioniert die Live-Aktualisierung automatisch?

Ja, sobald die Checkbox aktiv ist, aktualisiert sich die Vorschau bei jeder Eingabe.

Kann ich die Ansicht umschalten?

Ja, zwischen nur Quellcode, geteilter Ansicht und reiner Vorschau lassen sich jederzeit wechseln.

Einschränkungen

Das iframe läuft in einer Sandbox ohne Skript-Zugriff auf die übergeordnete Seite. Unbekannter HTML-Code sollte dennoch mit Vorsicht verwendet werden.

Was das Werkzeug kann

Live-Vorschau in einem sandboxed iframe, Ansichten: Code, Geteilt, Nur Vorschau, Optionale Aktualisierung bei Eingabe, Isolierte Darstellung ohne Zugriff auf Ihre Seite

Noch ein Blick aufs Markup gefällig?:

📄

HTML formatieren & minifizieren

HTML-Dokumente einrücken, verschachtelte Tags korrekt ausrichten und in komprimierter Form ohne überflüssige Leerräume ausgeben – für saubere Vorlagen.

›
{ }

JSON formatieren & validieren

JSON-String in Echtzeit einrücken, komprimieren, sortieren und auf Syntaxfehler prüfen – mit Zeilenbaum, Pfaden und direktem Export als .json-Datei.

›
🔍

Regex-Tester

Reguläre Ausdrücke live gegen einen Testtext prüfen, Treffer farblich markieren, Gruppen und Ersetzungen anzeigen und auf Fehlersuche in Mustern gehen.

›
🔡

Namenskonventionen – camelCase, snake_case

Bezeichner in camelCase, snake_case, kebab-case, PascalCase und CONSTANT_CASE umwandeln, um Namenskonventionen verschiedener Sprachen anzugleichen.

›
🔢

Zeichen & Wörter zählen

Eingetippten oder eingefügten Text live auf Zeichen, Wörter, Zeilen, Sätze und Bytes prüfen – nützlich für Meta-Beschreibungen und Social-Media-Texte.

›
🔢

Text kodieren – Hex, Binär, Dezimal, Unicode

Text in Hexadezimal, Binär, Oktal, Dezimal und Unicode-Codepunkte kodieren und jede dieser Darstellungen wieder in lesbaren Text zurückwandeln.

›
📜

ASCII-Tabelle

Die komplette ASCII-Tabelle mit Dezimal-, Hex- und Oktalwerten, Steuerzeichen-Namen und optionaler Latin-1-Erweiterung – filterbar und nachschlagbar.

›
🔁

JSON, XML und YAML umwandeln

Datenobjekte zwischen JSON, XML und YAML in beide Richtungen konvertieren, Einrückung und Schlüsselreihenfolge beibehalten und Fehler bei der Syntax anzeigen.

›

Ähnliche Werkzeuge

🎨

Code formatieren

JSON, HTML, CSS, JavaScript und SQL in einem Werkzeug einrücken, komprimieren und auf Syntaxfehler prüfen – für Entwickler beim täglichen Code-Review.

›
🔁

JSON und CSV umwandeln

JSON-Arrays zwischen CSV, TSV und durch Pipe getrennt umwandeln, verschachtelte Felder auflösen und die Kopfzeile aus den Schlüsseln übernehmen.

›
🔁

JSON, XML und YAML umwandeln

Datenobjekte zwischen JSON, XML und YAML in beide Richtungen konvertieren, Einrückung und Schlüsselreihenfolge beibehalten und Fehler bei der Syntax anzeigen.

›
🔓

JWT decodieren

Einen JSON-Web-Token in Header, Payload und Signatur zerlegen, die Claims wie Ablaufzeit und Aussteller lesbar darstellen – ohne die Signatur zu verifizieren.

›
🧹

Kommentare aus Code entfernen

Einzeilige und mehrzeilige Kommentare aus JavaScript, CSS, HTML und Python-Quellcode entfernen, dabei Strings und reguläre Ausdrücke nicht verändern.

›
🎲

Testdaten erzeugen

Realistisch wirkende Testdaten wie Namen, Adressen, E-Mails, Telefonnummern, Firmen und USt-IdNummern für Entwicklertests und Mock-ups im Browser erzeugen.

›
🆔

NanoID erzeugen – kollisionsarme Kennungen

Kollisionsarme NanoID-Kennungen mit frei wählbarem Alphabet und Länge direkt im Browser erzeugen und in großen Stückzahlen zur Zwischenablage kopieren.

›
🔤

Datei in Base64 umwandeln – Bild & Datei

Beliebige Dateien und Bilder als Base64-Daten-URI kodieren, um sie in CSS, HTML oder JSON einzubetten – und Base64 wieder zurück in eine Datei verwandeln.

›