
PerfectPixel by WellDoneCode (pixel perfect)
Veröffentlichen Sie Ihr Mockup auf der Live-Seite für einen pixelgenauen Vergleich mit Ihrem Code.

Screenshots
1 / 5
Was PerfectPixel by WellDoneCode (pixel perfect) macht
PerfectPixel by WellDoneCode (pixel perfect), veröffentlicht von Ilya Stepanov, ist für Chrome gelistet. Der Entwickler beschreibt seinen Zweck als "Stelle dein Mockup auf die Live-Seite, um pixelgenau mit deinem Code zu vergleichen." Dieser Leitfaden vereint die dokumentierten Funktionen, Einstiegspunkte für die Installation und Kompatibilitätsdetails, damit Sie entscheiden können, ob er zu Ihrer Aufgabe passt.
Dokumentierte Merkmale
Die offizielle Auflistung dokumentiert die untenstehenden Möglichkeiten. Vergleiche die benötigten Funktionen mit der verfügbaren Plattform und den Informationen zu kostenpflichtigen Funktionen vor der Installation. Dies sind die Beschreibungen des Entwicklers, keine unabhängigen Leistungs- oder Sicherheitstestergebnisse.
"Positionieren und skalieren Sie die Überlagerung, dann passen Sie die Deckkraft an, um zu vergleichen."
"Überlagern Sie jede PNG, JPG oder SVG auf einer Webseite"
"Verstellbare Opazität für Echtzeit-visuellen Vergleich"
"4 Blend-Modi (Differenz, Invertieren, Multiplizieren, Überlagerung) plus Normal – jeder nützlich, um verschiedene Arten von Fehlanpassungen zu erkennen"
"Mobile Designs im DevTools-Gerätemodus: PerfectPixel ins Seitenfeld des Browsers verschieben, damit das Sichtfenster frei bleibt"
"Per-Domain-Persistenz: Ihre Layer bleiben pro Seite gespeichert und werden automatisch über Browsersitzungen hinweg wiederhergestellt"
"Mehrere Schichten pro Domäne"
"Skalierung, Neupositionierung und Zentrierung der Steuerungen"
Installieren und Öffnen PerfectPixel by WellDoneCode (pixel perfect)
Öffnen Sie den Link zum Chrome Web Store, bestätigen Sie PerfectPixel by WellDoneCode (pixel perfect) und den Publisher Ilya Stepanov und wählen Sie dann Chrome hinzufügen. Lesen Sie die angeforderten Genehmigungen, bevor Sie bestätigen. Nach der Installation bietet das Menü Chrome-Erweiterungen Zugriff auf die Erweiterung; Das Anheften des Werkzeugleistensymbols ist optional. Um es später zu deaktivieren oder zu entfernen, nutzen Sie die Seite Erweiterungen verwalten in Chrome.
Das Manifest deklariert eine Aktion in der Symbolleiste. Verwenden Sie den Toolbar-Eintrag, um die Aktion der Erweiterung zu öffnen. Eine Optionsseite wird deklariert; Öffnen Sie die Details der Erweiterung unter Erweiterungen verwalten, um auf die Einstellungen zuzugreifen.
Verwendung des dokumentierten Arbeitsablaufs
Beginnen Sie mit der Operation, die Ihrer Aufgabe entspricht. Die folgenden Maßnahmen sind in der offiziellen Liste dokumentiert; Es sind separate Nutzungsoptionen, keine Sequenz, die jeder Benutzer abschließen muss. Für hier nicht genannten Steuerungen konsultieren Sie https://www.welldonecode.com/perfectpixel und gehen nicht davon aus, dass es einen bestimmten Knopf oder ein bestimmtes Menü gibt.
"Sperre das Overlay, um durchzuklicken und mit den darunterliegenden Seitenelementen zu interagieren"
"So funktioniert es: Installieren Sie die Erweiterung, öffnen Sie eine beliebige Seite und fügen Sie ein Bild ein – Drag & Drop, eine URL einfügen, aus der Zwischenablage einfügen oder den Dateiwähler verwenden."
Plattformen, Versionen und Schnittstellensprachen
Verifizierte Store-Editionen: Chrome, Microsoft Edge, Firefox. Die aufgenommene Chrome-Version ist 3.2.0.2, aktualisiert am 28.09.2026. Versionsnummern und Funktionsverfügbarkeit können je nach Geschäft unterschiedlich sein. Verwenden Sie den entsprechenden offiziellen Store-Button; ein Browser, der Chromium teilt, ist kein Beweis für eine separate offizielle Store-Edition.
Der offizielle Store listet drei Benutzeroberflächensprachen auf. Die unterstützten Sprach-Tags auf dieser Seite stammen aus den Metadaten dieses Produkts; Sie sind getrennt von den acht für diesen Leitfaden verfügbaren Sprachen. Überprüfen Sie den aktuellen Store, ob eine bestimmte Sprache für Ihren Arbeitsablauf unerlässlich ist.
Preis- und kostenpflichtige Features
Der Entwickler beschreibt eine kostenlose Version, eine Testversion oder eine kostenlose Version neben kostenpflichtigen Funktionen. Schau auf der offiziellen Website nach den aktuellen Funktionslimits und Preisen in deiner Region nach. Die Installation des Browserpakets und das Abonnement eines verbundenen Dienstes sind getrennte Aktionen; Ein Browser-Store-Button allein legt nicht fest, welche kostenpflichtigen Funktionen enthalten sind.
Berechtigungen, Privatsphäre und praktische Grenzen
Das veröffentlichte Erweiterungsmanifest listet diese API-Berechtigungen auf: activeTab, scripting, sidePanel, storage, unlimitedStorage. Dies sind deklarierte Fähigkeiten, kein Beweis dafür, welche Daten der Entwickler tatsächlich sammelt. Überprüfen Sie die Installationsaufforderung von Chrome und die Datenschutzrichtlinie (https://www.welldonecode.com/privacy/) des Entwicklers, bevor Sie Zugriff gewähren.
Die Details der Chrome-Erweiterung ermöglichen es dir, den Seitenzugriff zu überprüfen und die Erweiterung zu deaktivieren. Wenn eine erwartete Steuerung nicht erscheint, prüfen Sie, ob die Erweiterung aktiviert ist und die aktuelle Seite in ihrer Beschreibung unterstützt wird. Gewähren Sie nicht jeder Seite den Zugriff, nur um eine einzelne Website zu beheben.
Fragen zu PerfectPixel by WellDoneCode (pixel perfect)
Wo ist der offizielle Download? Verwenden Sie den Chrome Web Store-Button für die genaue Liste, die in diesem Leitfaden erwähnt wird: https://chromewebstore.google.com/detail/dkaagdgjmgdmbnecmcefdhjekcoceebi?hl=en. Für andere verifizierte Plattformen verwenden Sie deren separate Store-Buttons. Diese Seite verteilt keine Installationspakete oder modifizierte Kopien.
Wo sollte ich nachsehen, wenn sich eine Funktion geändert hat? Vergleichen Sie die aktuelle Store-Version mit 3.2.0.2 und prüfen Sie dann https://www.welldonecode.com/perfectpixel. Die Store-Screenshots zeigen die bereitgestellten Produktbilder, aber spätere Versionen und Gerätelayouts können sich unterscheiden. Nutzen Sie den offiziellen Support-Kanal für konto-, abrechnungs- und produktspezifische Probleme.