Fudge
Was ist Fudge?
Fudge ist eine KI-gestützte Suchmaschine für Designreferenzen, mit der Coding-Agenten bessere Websites erstellen können, indem sie Tausende echter Websites aus dem Produktiveinsatz durchsuchen und analysieren. Das Tool liefert Screenshots zusammen mit vermessenen Designdaten wie Typografie, Farben, Abständen, Layouts, Komponenten, Seitentypen, Medien, Interaktionen, Kontrast, Rahmen, Radien, Schatten und Farbverläufen. Fudge funktioniert über MCP mit Tools wie Codex, Cursor und Claude Code. Die Chrome-Erweiterung ermöglicht es, Websites und Designdetails für später zu speichern. Agenten können mit Fudge Inspirationen entdecken, visuelle Richtungen vergleichen, Schriftarten und Farbsysteme analysieren, Screenshots abgleichen und Designsysteme für Tailwind CSS, CSS-Variablen oder JSON exportieren.
Wie benutzt man Fudge?
Installiere Fudge mit dem Setup-Befehl npx -y @withfudge/design@latest setup in einem kompatiblen KI-Coding-Tool. Bitte deinen Agenten, Designinspirationen, Schriftarten, Farben, Layouts, Seitentypen oder Websites zu finden, die einem Screenshot ähneln. Der Agent kann die passenden Referenzen analysieren und deren Typografie, Farben, Abstände, Layouts und Komponentendetails beim Erstellen verwenden. Zusätzlich kannst du die Chrome-Erweiterung installieren, um Websites oder ausgewählte Seitenbereiche für spätere Suchen und Projektsammlungen zu speichern.
Fudge's Hauptmerkmale
Tausende echte Websites aus dem Produktiveinsatz nach Stil, Layout, Farbe, Schriftart, Seitentyp, Komponente, Domain oder visueller Ähnlichkeit durchsuchen
Screenshots mit vermessenen Angaben zu Typografie, Farben, Abständen, Layouts, Komponenten, Kontrast, Rahmen, Radien, Schatten, Farbverläufen und Mediendetails bereitstellen
Verwendete Schriftarten analysieren und ähnliche Schriftarten oder Schriftkombinationen entdecken
Seiten wie Preisübersichten, Dashboards, Dokumentationen, Onboarding-Abläufe, Login-Seiten, Portfolios und Landingpages finden
Hochgeladene Screenshots mit Websites abgleichen, die eine ähnliche visuelle Gestaltung aufweisen
Websites und Seitenbereiche mit der Chrome-Erweiterung speichern
Gespeicherte Referenzen in Projektsammlungen organisieren und wiederverwenden
Gespeicherte Designreferenzen direkt in KI-Coding-Unterhaltungen durchsuchen und vergleichen
Typografie, Farben, Abstände, Radien, Schatten und Farbverläufe als Tailwind CSS, CSS-Variablen oder JSON exportieren
Mit MCP-kompatiblen KI-Coding-Tools wie Codex, Cursor und Claude Code arbeiten
Farben nach ihrer Rolle analysieren sowie Kontrast, lesbare Textfarben und Farbabstufungen prüfen
Medien, Videos, Zuschnitte, Animationen, Interaktionen, Overlays, Clipping, Viewport und Aufnahmekontext berücksichtigen, sofern relevant
Fudge's Anwendungsfälle
Echte Designreferenzen für eine neue SaaS-Landingpage finden
Serifen-Schriftkombinationen für eine bereits verwendete serifenlose Schrift entdecken
Websites finden, die eine bestimmte Schriftart wie Merriweather oder Anthropic Serif verwenden
Die Schriftarten und Farben einer Website in ein Tailwind-Theme exportieren
Dunkle Preisübersichten mit Serifenschrift für Überschriften, engen Radien, dezenten Schatten und barrierearmem CTA-Kontrast finden
Einen Screenshot mit Websites abgleichen, die eine ähnliche visuelle Richtung haben
Fintech-Designmuster analysieren, bevor ein Finanzprodukt entwickelt wird
Website-Referenzen für verschiedene Designprojekte speichern und vergleichen
Einem KI-Coding-Agenten konkrete visuelle Vorgaben geben, statt vage Begriffe wie „modern“ oder „hochwertig“ zu verwenden
Das Layout und Designsystem einer etablierten Produktwebsite analysieren, bevor eine ähnliche Benutzeroberfläche erstellt wird
FAQ von Fudge
Was stellt Fudge einem KI-Coding-Agenten zur Verfügung?
Welche KI-Coding-Tools funktionieren mit Fudge?
Kann Fudge nach Schriftarten und Schriftkombinationen suchen?
Kann Fudge das Designsystem einer Website exportieren?
Kann ich entdeckte Websites speichern?
Unterstützt Fudge die visuelle Suche anhand von Screenshots?
Was speichert Fudge zusätzlich zu einem Screenshot?
Gibt es bei Fudge einen kostenlosen Tarif?
Ist für den kostenlosen Tarif eine Kreditkarte erforderlich?
Wie unterscheidet sich Fudge von Galerien für Designinspiration?
Fudge Bewertungen (0)
Fudge Preise
Kostenlos
0 $ pro Monat
25 Fudge-Abfragen pro Tag, Zugriff auf den MCP-Server sowie die Suche und Analyse echter Website-Referenzen. Keine Kreditkarte erforderlich.
Pro
29 $ pro Monat
Unbegrenzte Fudge-Abfragen, Website- und Schriftartensuche, Screenshot-Abgleich, Farbtools, Speichern mit der Chrome-Erweiterung, Exporte für Tailwind v4, CSS-Variablen und JSON, unbegrenzte Sammlungen sowie bevorzugter Support. Bei jährlicher Abrechnung gibt es 17 % Rabatt.
Analyse von Fudge
Fudge Website-Traffic-Analyse
Geografischer Verkehr
Top 2 Regionen
Fudge Einbettungen starten
Verwenden Sie Website-Badges, um die Unterstützung Ihrer Community für Ihren Toolify-Launch zu fördern. Sie lassen sich einfach auf Ihrer Homepage oder in der Fußzeile einbetten.
Alternative von Fudge
Social Media Listening