Text & Dokumente
Encoder/DecoderURL, Base64, HTML
TextkonvertercamelCase, snake_case...
Text-DiffZwei Texte vergleichen
LaTeXMathematische Formeln in der Vorschau
MarkdownEchtzeit-Vorschau
MermaidDiagramme als Code
DiagrammeVisueller Editor im Visio-Stil, Mermaid-Import
String-EscapingJS, JSON, SQL, Regex, HTML, URL
Unicode / ASCIIZeicheninformationen
Zahlen & Berechnung
RechnerMathematische Ausdrücke + LaTeX
BasiskonverterBasis 2 bis 64
Einheitensystembits, bytes, SI, IEC
Subnetz / CIDRNetzwerkrechner
Timestamp und DatumsangabenUnix, Zeitzonen, Formate
DatumsrechnerTage zwischen Daten, exaktes Alter, Wochentag
Daten & Formate
FormatkonverterJSON, YAML, Properties, ENV, CSV
JSON FormatterJSON formatieren und validieren
Regex TesterReguläre Ausdrücke
JSON-DiffVergleiche zwei JSONs strukturell
Code-FormatiererSQL, CSS, HTML, JavaScript
DB StudioVisuelle Postgres-Datenbank im Browser
SQL LabSQL mit echtem Postgres validieren, ausführen und optimieren
Viewer für riesige DateienRiesige CSV/Logs öffnen, ohne sie zu laden
Visueller ETL-FlussDaten durch Verketten von Knoten transformieren
Sicherheit
Text-AnonymisiererPII und Geheimnisse schwärzen (umkehrbar)
JWT InspectorJWT-Tokens dekodieren
Authentifizierungs-FlowsBasic, JWT und OAuth2 Schritt für Schritt
Hash-GeneratorSHA-256, SHA-384, SHA-512
GeneratorenPasswörter und UUIDs
Entwicklung & DevOps
CronGenerator und Validator
Docker → Composedocker run in Compose konvertieren
Skaffold Multi-ConfigAbhängigkeitsgraph und requires-Validierung
Linux: Rechte und Benutzerchmod, chown, useradd und Gruppen
URLURLs parsen und erstellen
ZufallsdatenNamen, E-Mails, IPs, UUIDs...
ElektronikOhm, Widerstände in Reihe/parallel
LogikgatterSimulator für AND-, OR-, NOT-Gatter und mehr
Simulador de ArquitecturasDiagrama CI/CD, cloud, IA/MCP y simula la carga
QuantensimulatorQubits, Gatter, Superposition und Verschränkung
HammingFehlererkennung
Nginx/Apache-SPA-KonfigurationErzeuge eine Konfiguration zum Bereitstellen einer SPA
SemverSemantische Versionsbereiche
CORS ExplainerAnalysiere die CORS-Header deines Servers
Cert InspectorAnalysiere X.509-Zertifikate im PEM-Format
Rate LimiterSimuliere Token Bucket und Fixed Window
Assembler-SimulatorVereinfachte MIPS-ISA · Schritt für Schritt · Register & Speicher
Kontext-SchmiedeVerpacke und schütze dein Projekt für die KI
Künstliche Intelligenz
LLM-KostenMonatliche Ausgaben simulieren
Prompt-BuilderSystem-Prompt für KI-Agenten
EmbeddingsÄhnlichkeit, 2D-Karte und RAG
Lokale KIChat, Zusammenfassung, Übersetzung & Sentiment im Browser
TokenizerVisualisiere Tokens, vergleiche Modelle, schätze Kosten
Wahrscheinlichkeit für KIVerteilungen, Softmax, Bayes und Entropie
GradientenabstiegSGD, Momentum, RMSProp, Adam
Neuronales NetzTrainiere ein MLP und beobachte, wie die Grenze entsteht
Mini-LLMTrainiere ein Sprachmodell mit deinem Text
DimensionalitätsreduziererPCA, t-SNE und UMAP live
Konfusionsmatrix & ROCSchwellenwert, Precision/Recall, ROC/AUC, PR
Clustering (k-means, DBSCAN)Entdecke Gruppen ohne Labels
Attention-VisualisiererWorauf jedes Wort in einem Transformer schaut
Faltung & CNN-FilterBildfilter und Merkmalskarten
EntscheidungsbaumEntscheidungsregionen + der Baum
Fourier & FaltungFFT-Spektrum und Signalfilter
DiffusionDas Rauschen hinter Stable Diffusion
Regression & MLEKleinste Quadrate, Overfitting, Ridge
Markov-KettenZustände, stationäre Verteilung und Text
Hypothesentestp-Werte, t-Test, χ², ANOVA und Teststärke
OCR — Bild zu TextExtrahiert Text aus Bildern, 100 % lokal
Finanzen
InflationWertverlust des Geldes Jahr für Jahr
ZinseszinsKapital + Einzahlungen + Zinseszins
Hypothek / KreditMonatliche Rate und französischer Tilgungsplan
Ausgaben teilenWer wem wie viel schuldet
Gesundheit & Wohlbefinden
GesundheitBMI, Idealgewicht, Grundumsatz und Schlafzyklen
Produktivität
PomodoroArbeitstechnik mit Zeitblöcken
StoppuhrMit Runden, Etappen und Verlauf
Spiele & Unterhaltung
WürfelTische mit numerischen und symbolischen Würfeln
PunktezählerPunkte pro Spieler mit Spiel-Timer
Auslosung / GlücksradWähle ein zufälliges Element aus einer Liste
NamensgeneratorEchte, fantastische, Sci-Fi- und nordische Namen
Multimedia & Design
Farbe HEX/RGB/HSLFarbkonverter
QR-CodeQR-Codes generieren
BilderGröße ändern, konvertieren, Base64
PDF ToolsZusammenführen, extrahieren, Wasserzeichen
DiagrammeDaten mit Diagrammen visualisieren
WCAG-KontrastWCAG AA/AAA-Kontrastverhältnis
Unternehmen
Meeting-KostenWie viel kostet jedes Meeting wirklich?
SLA / UptimeVerfügbarkeitsprozentsatz ↔ Ausfallzeit
Break-evenBreak-even-Punkt zwischen Kosten und Einnahmen
Burn Rate / RunwayWie lange reicht deine Kasse noch?
A/B-TestStatistische Signifikanz von Experimenten
DORA MetricsStufe dein Team nach DevOps-Metriken ein
UTM BuilderErstelle und dekodiere URLs mit UTM-Parametern
Bedienungsanleitung
Worauf schaut jedes Wort?

Die Attention ist das Herz der Transformer (BERT, GPT…). Jedes Token berechnet für alle anderen, wie stark es sie beim Aufbau seiner Repräsentation «anschauen» soll. Hier siehst du es: Die Matrix ist Token-zu-Token (jede Zeile ergibt in Summe 1) und die Bögen zeigen, wohin das von dir gewählte Token schaut. Schreibe deinen eigenen Satz.

Query, Key und Value (Q/K/V)

Um zu entscheiden, wen es beachten soll, entstehen aus jedem Token drei Vektoren: Query (Q, „was ich suche“), Key (K, „was ich anbiete“) und Value (V, „was ich beitrage, wenn man mich beachtet“).

• Das Gewicht von Token i gegenüber j ist das Skalarprodukt aus der Query von i und dem Key von j.
• Es wird durch √dk geteilt (Skalierung, damit die Zahlen nicht explodieren) und durch Softmax geschickt, das die Gewichte jeder Zeile in Prozentwerte umwandelt, die sich zu 1 summieren.
• Kurz gesagt: A = softmax(Q·Kᵀ / √dk). Dieses Werkzeug zeichnet diese Matrix A; ein echtes Modell würde diese Gewichte nutzen, um die Values zu mischen.

Mehrere Heads

Ein Transformer hat nicht EINE Attention, sondern mehrere Heads parallel, jeder mit anderen Projektionen → jeder achtet auf andere Beziehungen (einer auf das vorherige Wort, ein anderer auf das Subjekt…). Wechsle den Head und beobachte, wie sich das Muster verändert.

Kausale Maske (GPT)

Modelle, die Text generieren (GPT), können nicht in die Zukunft schauen: Jedes Token beachtet nur die vorherigen. Aktiviere die kausale Maske und du siehst, wie die obere Hälfte der Matrix erlischt — so wird trainiert, das nächste Token vorherzusagen. Ohne Maske (BERT) sieht jedes Token den ganzen Satz.

Wie man die Heatmap liest

Die Attention-Matrix ist eine Heatmap Token × Token: Die Zeile ist das Token, das schaut (von), und die Spalte das Token, das angeschaut wird (nach).

• Je intensiver blau die Zelle, desto höher das Gewicht; Weiß ist fast null.
• Jede Zeile summiert sich auf 100 % (es ist eine Verteilung).
• Fahre mit der Maus über eine Zelle, um den genauen Wert zu lesen (z. B. gato → gato: 40%).
• Die Diagonale leuchtet meist auf: Fast immer beachtet sich ein Token ziemlich stark selbst.

Die Bögen: wohin ein Token schaut

Klicke im Satzstreifen auf ein Wort, und es erscheinen Bögen zu den Wörtern, die es beachtet, entnommen aus dieser Zeile der Matrix. Dicke und Deckkraft jedes Bogens sind proportional zum Gewicht (Gewichte unter 2 % werden ausgeblendet). Klicke erneut, um die Auswahl aufzuheben. Es ist dieselbe Information wie eine Zeile der Heatmap, aber über dem Text gezeichnet, um sie auf einen Blick zu lesen.

Anleitung (Schritt für Schritt)

1. Schreibe einen Satz in das Feld oben (wird nach Wörtern und Satzzeichen tokenisiert, bis zu 40 Tokens).
2. Wähle einen Kopf (1–4), um unterschiedliche Muster zu sehen.
3. Aktiviere oder deaktiviere die kausale Maske, um GPT mit BERT zu vergleichen.
4. Klicke auf ein Wort (im Streifen oder in seiner Zeilenbeschriftung), um seine Bögen zu zeichnen.
5. Fahre mit der Maus über die Heatmap, um genaue Gewichte zu lesen. Alles wird sofort neu berechnet, in deinem Browser.

Dieses Demo im Vergleich zu einem echten Modell

Dieser Visualisierer ist didaktisch und deterministisch (offline): Die Vektoren jedes Tokens werden per Hash erzeugt (gleiche Tokens → gleicher Vektor) plus einer sinusförmigen Positionskodierung, und die Q/K-Projektionen werden mit einem Seed festgelegt, sodass das Ergebnis reproduzierbar ist. Die Attention-Berechnung (skaliertes Skalarprodukt + Softmax, mit optionaler kausaler Maske) ist echt. Ein echtes Modell lernt Q/K/V aus Daten und stapelt Dutzende Schichten und Köpfe. Verwandt: Tokenizer, Mini-LLM und Dimensionsreduzierer.

Attention-VisualisiererWorauf jedes Wort in einem Transformer schaut
Attention-VisualisiererSieh, auf welche Wörter jedes Token «schaut» — der Mechanismus im Inneren eines Transformers
Head

Klicke auf ein Wort, um zu sehen, wohin es schaut:

Elgatosesentóenlaalfombraporqueestabacansado
Attention-Matrix (Zeile = von, Spalte = nach)
ElgatosesentóenlaalfombraporqueestabacansadoElEl → El: 9%El → gato: 3%El → se: 13%El → sentó: 3%El → en: 0%El → la: 2%El → alfombra: 1%El → porque: 37%El → estaba: 5%El → cansado: 27%gatogato → El: 3%gato → gato: 1%gato → se: 13%gato → sentó: 6%gato → en: 26%gato → la: 2%gato → alfombra: 10%gato → porque: 2%gato → estaba: 36%gato → cansado: 1%sese → El: 5%se → gato: 4%se → se: 6%se → sentó: 11%se → en: 12%se → la: 13%se → alfombra: 33%se → porque: 1%se → estaba: 13%se → cansado: 1%sentósentó → El: 2%sentó → gato: 11%sentó → se: 19%sentó → sentó: 21%sentó → en: 9%sentó → la: 6%sentó → alfombra: 20%sentó → porque: 3%sentó → estaba: 7%sentó → cansado: 2%enen → El: 3%en → gato: 45%en → se: 17%en → sentó: 13%en → en: 12%en → la: 4%en → alfombra: 1%en → porque: 2%en → estaba: 1%en → cansado: 1%lala → El: 6%la → gato: 11%la → se: 25%la → sentó: 34%la → en: 7%la → la: 3%la → alfombra: 4%la → porque: 3%la → estaba: 6%la → cansado: 1%alfombraalfombra → El: 6%alfombra → gato: 13%alfombra → se: 21%alfombra → sentó: 21%alfombra → en: 7%alfombra → la: 8%alfombra → alfombra: 10%alfombra → porque: 6%alfombra → estaba: 4%alfombra → cansado: 5%porqueporque → El: 26%porque → gato: 17%porque → se: 9%porque → sentó: 11%porque → en: 2%porque → la: 7%porque → alfombra: 4%porque → porque: 5%porque → estaba: 9%porque → cansado: 9%estabaestaba → El: 14%estaba → gato: 13%estaba → se: 15%estaba → sentó: 32%estaba → en: 11%estaba → la: 3%estaba → alfombra: 2%estaba → porque: 7%estaba → estaba: 1%estaba → cansado: 2%cansadocansado → El: 17%cansado → gato: 17%cansado → se: 7%cansado → sentó: 27%cansado → en: 11%cansado → la: 7%cansado → alfombra: 6%cansado → porque: 2%cansado → estaba: 5%cansado → cansado: 2%

Dies ist der Attention-Mechanismus (skaliertes Skalarprodukt + Softmax). Ein echtes Modell lernt die Q/K/V-Projektionen und stapelt Dutzende Schichten und Heads, aber die Idee ist genau diese. Verwandt: Tokenizer, Mini-LLM und Dimensionsreduktion.