Alles in einem
Früher habe ich fünf Erweiterungen geöffnet, um eine Website zu analysieren. Jetzt öffne ich eine und sehe Schrift, Farben, CSS und SEO, ohne Konto.
Ein einziges Fenster
Jede Erweiterung zeigte ihre Daten in ihrem eigenen Fenster, und keine speicherte etwas. Jetzt sehe ich alles zusammen und speichere es.
Vergleichen
Ich speichere den Steckbrief meiner Website und die der ersten drei bei Google und sehe sie nebeneinander in einer Tabelle.
Alles griffbereit
Ich fahre mit der Maus darüber und sehe Schrift, Farben und CSS von allem, worauf ich zeige. Mit einem Klick SEO und Screenshot der Seite.
Ausprobieren
Bevor ich etwas installiere, schalte ich die Demo ein und fahre über genau diese Seite: Ich sehe Schrift, Größe, Farbe und Box.
Die Daten, wie sie sind
Ich sehe die Schrift mit ihrer Lizenz, das SEO einer URL und das Designsystem der Website, so wie sie sind, ohne etwas von Hand zu kopieren.
Für wen
Designer, SEO oder Agentur: Jeder holt sich, was er braucht, von den Tokens der Referenz bis zur Tabelle für den Kunden.
Lebendiges Produkt
Ich schaue mir die Neuigkeiten an: die v1.0 zum Launch und den Vorabzugang zu sieben Pro-Funktionen.
Launch
Ich lese die Liste zum Launch-Tag: Inspektion, SEO und Screenshots sind ab dem ersten Tag dabei.
Preise
Das Wichtigste ist für immer kostenlos. Pro ist eine Einmalzahlung ohne Abo, und sieben Pro-Funktionen sind im Vorabzugang kostenlos.
Warteliste
Sie ist noch nicht im Chrome Web Store: Ich trage mich in die Warteliste ein, um sie als Erster zu testen.
Fragen
Vor der Installation gehe ich die häufigsten Fragen durch und finde die Antwort, ohne die Seite zu verlassen.
Chrome-Erweiterung · Design und SEO
Lesen Sie Schriften, Farben, CSS und SEO jeder Seite aus, vergleichen Sie mehrere Websites in einer Tabelle und exportieren Sie ihr Designsystem nach Tailwind.
Lokal, ohne Konto · Pro als Einmalzahlung · 8 Sprachen
Vorher
Mit Smart Design Inspector
Die Hauptfunktion
Speichern Sie den Steckbrief jeder Website und vergleichen Sie sie: Title, Überschriften, Schema, Schriften, Farben und Core Web Vitals. Exportieren Sie die Tabelle als CSV oder Markdown und geben Sie sie Ihrem Kunden.
Websites vergleichen →| ihrkunde.example | wettbewerber-a.example | wettbewerber-b.example | |
|---|---|---|---|
| Title | 58 ZeichenOK | 74 ZeichenAusbaufähig | 52 ZeichenOK |
| H1 | 1OK | 0Fehlt | 1OK |
| Schema | OrganizationOK | —Fehlt | ProductOK |
| Schrift | Inter | Poppins | DM Sans |
| Farbe | #2563EB | #16A34A | #0B0B0B |
| LCP | 1,8 sOK | 3,4 sAusbaufähig | 2,1 sOK |
Speichern Sie für jeden Wettbewerber einen Steckbrief und vergleichen Sie alle in einer exportierbaren Tabelle.
Websites vergleichen →Title, Description, Open Graph, H1–H6, Schema, hreflang, robots, Sitemap und llms.txt, mit Hinweisen. Und mit einem Klick zu PageSpeed oder isitagentready.com.
SEO-Inspektor →Mit der Maus darüberfahren und berechnetes CSS, Box, Abstände und Ränder sehen.
CSS-Inspektor →Familie, Schriftschnitte, Herkunft, Lizenz und Schriftskala der ganzen Seite.
Welche Schrift eine Website nutzt →Die Farbpalette der Seite, Pipette und WCAG-Kontrast für jedes Text-Hintergrund-Paar.
Die Farben einer Website auslesen →Farben, Abstände und Typografie als Tailwind v4 @theme, CSS-Variablen oder DESIGN_SPECS.md.
Designsystem extrahieren →Einen Abschnitt als JSX + Tailwind oder als HTML/CSS kopieren.
Eine Website in Tailwind umwandeln →Ganze Seite als PNG oder PDF oder ein einzelnes Element.
Aktivieren Sie die Demo und fahren Sie mit der Maus über diese Seite: Sie sehen Schrift, Größe, Farbe und Box jedes Elements, wie in der Erweiterung.
Nur am Desktop · Die Erweiterung kann viel mehr
Schriften
Familie, Schnitte, Größen und Herkunft jeder Schrift der Seite, dazu die komplette Typo-Skala von H1 bis zu den Buttons.
Playfair Display
Google Fonts · OFL
SEO-Inspektor
Alles, was Google im Head und im Body liest, mit Hinweisen, was zu beheben ist.
| Title | Smart Design Inspector – Design & SEO… | OK |
| Description | Untersuchen Sie jede Website direkt in Chrome… | Zu lang |
| Canonical | / | OK |
| OG image | — | Fehlt |
| hreflang | 8 Sprachen + x-default | OK |
| llms.txt | /llms.txt | OK |
Designsystem Pro
Farben, Abstände und Typografie, bereit zum Einfügen in Ihr Projekt oder für Ihre KI.
@theme/* ihrkunde.example */@theme { --color-primary: #2563eb; --color-ink: #0b0b0b; --font-sans: "Inter", sans-serif; --spacing: 4px; --radius-md: 8px;}Sehen Sie, wie die Referenz Ihres Kunden gebaut ist, und übernehmen Sie ihre Tokens in Ihr Projekt, ohne DevTools zu öffnen.
Ergebnis: Ihr DesignsystemPrüfen Sie das On-Page-SEO einer URL in Sekunden und vergleichen Sie die Ihres Kunden mit den Top 3 bei Google.
Ergebnis: On-Page-AuditGeben Sie Ihrem Kunden eine Tabelle mit seiner Website im Vergleich zum Wettbewerb, mit einem Klick exportiert.
Ergebnis: Vergleich als CSV oder MarkdownBewertungen
Neueste Updates
22 Funktionen für immer kostenlos, dazu 7 Pro-Funktionen im Vorabzugang. Ohne Konto und ohne Zeitlimit.
Kostenlos für alle bis zum Start der Pro (Datum folgt)
Der Inspirationsmodus (Texte und Bilder beim Kopieren als Platzhalter) kommt kostenlos mit der ersten Pro-Version
Kostenlos
0 €, für immer
Pro
49 €, Einmalzahlung
Warteliste
Smart Design Inspector ist in Entwicklung. Hinterlassen Sie Ihre E-Mail-Adresse, und wir benachrichtigen Sie am Tag der Veröffentlichung im Chrome Web Store – mit den 7 Pro-Funktionen kostenlos im Vorabzugang.
Eine E-Mail am Starttag und nur wenige weitere · Abmeldung mit einem Klick
Ja. Inspektion, SEO und Screenshots sind dauerhaft kostenlos. Die Pro kostet einmalig 49 € und enthält ein Jahr Neuerungen.
Nein. Installieren und loslegen. Keine Anmeldung, weder für die kostenlose Version noch für die Pro.
Alles wird in Ihrem Browser verarbeitet. Die Seiten, die Sie besuchen, gehen an keinen Server, und auf fremden Websites wird weder Werbung noch ein Spendenaufruf eingeblendet. Wenn Sie die Seite in einem externen Audit öffnen (PageSpeed, isitagentready …), erhält diese Website die Adresse, nur wenn Sie klicken.
Sie liefert keine Keyword-Volumen oder Backlinks und lädt keine kostenpflichtigen Schriften herunter: Sie zeigt Ihnen die Lizenz und wo es sie gibt.
In Chrome, Edge, Brave, Arc, Opera und Vivaldi, unter Windows, Mac und Linux, ab Version 1.0. Sie läuft überall gleich, weil der Browser die Erweiterung ausführt, nicht das Betriebssystem. Der Code ist so vorbereitet, dass sie ohne Neuschreiben auf Firefox und Safari kommen kann. Während der Entwicklung kann sich noch etwas ändern.
Ja. Sie liest die Seite so, wie der Browser sie bereits dargestellt hat. Wie sie gebaut ist, spielt keine Rolle.
Cookies
Wir verwenden Google Analytics, um zu erfahren, wie viele Menschen die Website besuchen und welche Seiten funktionieren – nur, wenn Sie zustimmen. Keine Werbung. Cookie-Richtlinie.