Legg til utvidelsen i Chrome
- Åpne Chrome Web Store og søk etter utvidelsen "DevSuite Pro".
- Klikk på "Legg til i Chrome" og bekreft deretter ved å klikke på "Legg til utvidelse" i popup-vinduet.
64+ kraftige verktøy for å inspisere, måle, fange, analysere og designe nettsider direkte i nettleseren din.
Det er enkelt å komme i gang. Installer utvidelsen, åpne en nettside, og få tilgang til 64+ utviklerverktøy fra popup-vinduet eller det flytende dokken. Ingen konfigurasjon nødvendig.
DevSuite Pro tilbyr 64+ utviklerverktøy for inspeksjon, måling, design og analyse av nettsider. Akselerer arbeidsflyten din med kraftige funksjoner bygget rett inn i nettleseren din.
Hold musepekeren over et element for å se CSS-stilene umiddelbart og rediger dem live, noe som gjør det enklere å feilsøke og justere design i sanntid.
Lær mer →Klikk på et element for å inspisere dets egenskaper, dimensjoner, avstander, fonter og farger. Forstå sidestrukturen umiddelbart uten å åpne nettleserens DevTools.
Lær mer →Mål avstander, sjekk justering og legg til piksel-perfekte linjaler og guider på hvilken som helst nettside for å sikre at designene dine er perfekt justert.
Lær mer →Velg farger fra et hvilket som helst element på siden og kopier HEX-, RGB- eller HSL-verdier til utklippstavlen med ett klikk.
Lær mer →Ta skjermbilder av hele siden eller det synlige området av en nettside og last dem ned umiddelbart – perfekt for å dele design og rapportere feil.
Lær mer →Forhåndsvis en nettside i forskjellige skjermstørrelser og enhetsoppløsninger for å teste responsivt design uten å forlate nettleseren.
Lær mer →Sanntids inspeksjon og redigering av CSS-stiler
CSS Inspector er et kraftig utviklerverktøy som lar deg se alle CSS-egenskapene til ethvert element bare ved å holde musepekeren over det.
Fejlsøg og styr CSS-animationer i realtid
Animationsinspektoren giver dig fuld kontrol over alle CSS-animationer og overgange på enhver webside.
Konvertér et elements CSS til Tailwind-hjælpeklasser
Kopiér som Tailwind bygger bro mellem visuelt design og Tailwind CSS-kode.
Visualisér den komplette layoutstruktur på enhver side
Kun kontur-tilstand tilføjer farvekodede kantomrids til hvert HTML-element på en webside og giver dig et øjeblikkeligt…
Hent kategoriserede Tailwind-klasser til ethvert element
Tailwind-hjælperen inspicerer ethvert element på en webside og genererer en omfattende, kategoriseret opdeling af…
Visuel HTML-trævisning som overlay på enhver webside
Side-omrideren gengiver den komplette DOM-struktur af enhver webside som et visuelt træ-overlay — direkte på selve siden.
Registrér React-, Vue-, Angular- og Svelte-komponenter på ethvert websted
Komponentdetektoren identificerer automatisk, hvilken frontend-framework et websted bruger, og afslører dets komplette komponenttræ.
Træk og slip for at flytte ethvert element på en side
Flyt element lader dig klikke på et element på en webside og fysisk trække det til en ny position.
Fjern eller skift synlighed for ethvert element
Slet/skjul element lader dig fjerne eller midlertidigt skjule ethvert element på en webside med et enkelt klik.
Eksportér ethvert element som HTML, CSS eller JSON
Eksportér element lader dig klikke på et element på en webside og eksportere dets komplette struktur i tre formater: rå…
Generér React-, Vue- og Svelte-komponenter fra ethvert element
Kopiér komponentkode omdanner ethvert element på en webside til en ren, produktionsklar komponentfil til dit valgte framework.
Tag skærmbilleder af synligt område eller hele siden
Skærmbillede optager billeder i høj kvalitet af enhver webside i to tilstande: synligt område (præcis det, du ser i…
Vis, vælg og download alle billeder fra enhver webside
Udtræk billeder scanner enhver webside og præsenterer hvert billede i et gennembladeligt galleri.
Find, Forhåndsvis og Download Alle SVG'er på Enhver Side
SVG Grabber opdager alle SVG'er på en webside — inline SVG-elementer, eksterne .svg-filreferencer, SVG-sprites…
Byt Ethvert Billede på en Side med Dit Eget
Billederstatter lader dig klikke på et billede på en webside og erstatte det med dit eget — enten ved at uploade en…
Generer QR-koder for Enhver URL eller Tekst Øjeblikkeligt
QR-kodegenerator opretter automatisk en scanbar QR-kode for den aktuelle sides URL — eller for enhver brugerdefineret…
Pixel-præcise Linealer, Guider og Målinger på Enhver Side
Sidelineal tilføjer Photoshop-lignende linealer og trækkbare vejledningslinjer til enhver webside.
Forhåndsvis Flere Enhedsviewports Samtidigt
Responsiv visning viser den aktuelle webside gengivet i flere enhedsviewport-størrelser side om side — alt på én skærm.
Mål Præcise Pixelafstande Mellem To Elementer
Mål afstand lader dig klikke på to elementer på en webside og øjeblikkeligt se den præcise pixelafstand mellem dem…
Visualiser Alle Stacking-kontekster og Z-indeks-lag
Z-indeks-inspektor afslører den komplette stacking-rækkefølge for hvert element på en webside.
Inspicer CSS Grid og Flexbox-layouts med Visuelle Overlays
Grid/Flex-visualizer registrerer alle CSS Grid og Flexbox-beholdere på en webside og gengiver deres layoutstruktur som…
Simuler Bruger-opmærksomheds-hotspots på Enhver Side
Heatmap-simulator genererer et forudsagt opmærksomheds-heatmap for en webside baseret på etablerede…
Selektivt Ryd Cache, Cookies, localStorage og sessionStorage
Ryd browserdata giver udviklere en hurtig, selektiv måde at ryde specifikke typer browserdata for det aktuelle sted…
Registrer Alle Teknologier Bag Ethvert Websted
Site Stack scanner ethvert websted og identificerer dets komplette teknologistak — frontend-frameworks (React, Vue…
Komprehensiv SEO-audit: Meta-tags, Overskrifter, OpenGraph og Mere
SEO-inspektor giver en øjeblikkelig, komprehensiv SEO-audit af en webside.
Automatiseret WCAG-audit: Kontrast, Alt-tekst, ARIA og Mere
Tilgængelighedsinspektor kører automatiserede WCAG 2.1 Niveau AA-tjek på en webside og producerer en kategoriseret…
Klik på Enhver Tekst på Enhver Side for at Redigere den Øjeblikkeligt
Live teksteditor gør hvert tekstelement på en webside redigerbart med et enkelt klik.
Byt Enhver Skrifttype Globalt eller Per-Element fra Google Fonts
Skrifttype-skifter lader dig erstatte enhver skrifttype på en webside med en anden fra Google Fonts-biblioteket — enten…
Opdag Alle Skrifttyper Brugt på Enhver Webside
Vis alle skrifttyper scanner en webside og præsenterer en komplet oversigt over alle skrifttypefamilier i brug…
Præcisions-eyedropper for HEX, RGB og HSL farveværdier
Farvevælger giver et pixel-præcist eyedropper-værktøj til at vælge farver fra et element på en webside — tekst…
Udtræk den Komplette Farvepalet fra Enhver Webside
Farvepalet scanner alle elementer på en webside og udtrækker det komplette sæt af farver brugt — fra tekst og baggrunde…
Anvend Mørk Tilstand på Ethvert Websted Øjeblikkeligt
Tvungen mørk tilstand anvender et mørkt farveskema på ethvert websted, der ikke tilbyder et — eller tilsidesætter et steds lystema.
Aktiver eller Deaktiver JavaScript Per Fane Øjeblikkeligt
Slå JavaScript til/fra deaktiverer eller genaktiverer JavaScript-udførelse for den aktuelle browserfane med et enkelt klik.
Vis, Rediger, Tilføj og Slet Cookies for Ethvert Domæne
Cookie-editor viser alle cookies for det aktuelle domæne i en ren, sorterbar tabel.
Se Konsoloutput i et Flydende Panel — Uden DevTools
Konsollogger fanger alt konsoloutput (console.log, console.warn, console.error, console.info) og viser det i et…
Overvåg Alle Netværksanmodninger i Realtid
Netværksmonitor fanger og viser alle netværksanmodninger foretaget af den aktuelle side — XHR/Fetch API-kald…
Vis, Rediger, Tilføj og Slet localStorage og sessionStorage
Lokal lager-editor giver en ren tabelgrænseflade til at administrere localStorage og sessionStorage-poster for det aktuelle sted.
Skan Hvert Link på en Side og Find Brudte
Brudt link-tjekker scanner hvert link på den aktuelle side — ankerhref'er, billedkilder, scriptkilder og…
Øjeblikkeligt Ydelses-dashboard: Indlæsningstid, DOM-statistik og Ressourcer
Sideydelse giver et øjeblikkeligt ydelsesoverblik over enhver webside — indlæsningstidsmålinger (FCP, DOMContentLoaded…
Formater, komprimer og valider JSON med ett klikk
JSON Formatter formaterer, komprimerer og validerer JSON direkte i nettleseren.
Kod strenger til og fra Base64 umiddelbart
Base64 Encoder/Decoder konverterer tekst til Base64 og Base64 tilbake til tekst direkte i nettleseren.
Kod og dekod URL-strenger med ett klikk
URL Encoder/Decoder konverterer URL-strenger til og fra prosent-kodet form.
Kod og dekod HTML-entiteter umiddelbart
HTML Entity Encoder konverterer spesialtegn (< > & " ') til sine HTML-entitetsekvivalenter (< > & " ') og tilbake.
Escape og unescape strenger for kode
Backslash Escape/Unescape konverterer strenger til og fra sin escapede form (\n \t \r \" \' \\ og Unicode-escapes).
Konverter bilder til og fra Base64 data-URI-er
Bilde ↔ Base64 konverterer bildefiler (PNG, JPG, SVG, WebP, GIF) til Base64-kodede data-URI-er og tilbake.
Dekod JSON Web Tokens umiddelbart
JWT Debugger dekoder og inspiserer JSON Web Tokens — parser header, payload og signatur, viser claims og flagger utløpsstatus.
Generer UUID v4-identifikatorer i bulk
UUID-generator produserer kryptografisk sterke UUID v4-identifikatorer ved hjelp av nettleserens crypto-API.
Beregn MD5-, SHA-1-, SHA-256-, SHA-384-, SHA-512-hasher
Hash-generator beregner kryptografiske hasher (MD5, SHA-1, SHA-256, SHA-384, SHA-512) av vilkårlig tekstinput.
Generer kryptografisk sterke passord
Passordgenerator produserer sterke, tilfeldige passord ved hjelp av nettleserens kryptografiske tilfeldighets-API.
Test regulære uttrykk live med treffmarkering
Regex Tester evaluerer regulære uttrykk mot testtekst i sanntid.
Konverter Unix-, ISO- og menneskelesbare datoer
Timestamp Converter oversetter mellom Unix-tidsstempler (sekunder, millisekunder, mikrosekunder, nanosekunder), ISO…
Sammenlign to tekstblokker linje for linje
Diff Tool sammenligner to tekstblokker og markerer lagt til, fjernet og uendrede linjer med fargekodet output.
Sjekk WCAG-kontrastforhold mellom to farger
Contrast Checker beregner WCAG 2.1-kontrastforholdet mellom to farger og karaktersetter dem mot AA/AAA-terskler for…
Konverter HEX, RGB, HSL, HSV og OKLCH umiddelbart
Color Format Converter oversetter enhver farge mellom HEX, RGB, HSL, HSV og OKLCH.
Hent Ut Den Dominerende Paletten Fra Ethvert Bilde
Image Color Extractor analyserer en hvilken som helst bildefil (dra, lim inn eller klikk for å laste inn) og returnerer…
Få CSS-velgere og XPath for ethvert element
DOM Path Finder lar deg holde musepekeren over et hvilket som helst element på siden for å avdekke dets unike…
Test cross-origin-forespørsler og inspiser CORS-headere
CORS Checker tester om en cross-origin-forespørsel fra siden din ville blitt tillatt av målserveren.
Fang WebSocket-rammer i sanntid
WebSocket Inspector fanger opp hver WebSocket-ramme — sendt og mottatt — på tvers av alle tilkoblinger på siden.
Skann siden for ødelagte bilder på et øyeblikk
Broken Image Finder skanner hvert <img>-element og hver CSS background-image på siden, oppdager mislykkede innlastinger…
Fyll ut skjemaer automatisk med realistiske testdata
Form Filler fyller ut alle synlige skjemafelt på siden med realistiske testdata — navn, e-post, telefon, adresse, passord osv.
Konverter mellom CSV og JSON begge veier
CSV ↔ JSON-konverterer håndterer hele rundturen mellom de to vanligste tabellformatene.
Formater, valider og vis XML med syntaksutheving
XML Formatter formaterer pent, minifiserer og validerer XML direkte i nettleseren.
Gjør SQL-spørringer pene og oversiktlige
SQL Formatter omdanner minifisert eller rotete SQL til lesbare, innrykkede spørringer.
Lagre nettsider som rene PDF-er
Konverter til PDF lagrer den gjeldende nettsiden som en PDF via nettleserens utskriftsdialog, med utskriftsvennlige…
Velg den beste planen for din arbeidsflyt. Start gratis, oppgrader når som helst.
Vanlige spørsmål om funksjonene og bruken av DevSuite Pro-utvidelsen. Hvis du har et spørsmål, kan svaret allerede være her under.
Besøk Chrome Web Store, søk etter "DevSuite Pro", klikk på "Legg til i Chrome" og bekreft ved å velge "Legg til utvidelse". Etter installasjon vil utvidelsesikonet vises i verktøylinjen i nettleseren din. Klikk på det for å få tilgang til 64+ utviklerverktøy umiddelbart.
Gratisverktøy (43+) er tilgjengelige for alle uten lisens. Pro-verktøy har et gullfarget PRO-merke og krever en aktiv Pro-lisens for å brukes. Du kan se hvilke verktøy som er gratis eller pro fra popup-vinduet – gratisverktøy har ikke et låseikon, mens pro-verktøy ser litt nedtonet ut til du aktiverer lisensen din.
Noen nettsteder har strenge Content Security Policies (CSP) som blokkerer visse handlinger fra nettleserutvidelser. Dette er spesielt vanlig på nettbanker og offentlige nettsteder. I tillegg tillater ikke Chromes interne sider (chrome://) at utvidelser kjører innholdsskript.
Nei. Alle endringer gjort av verktøy som Flytt element, Live tekstredigerer, Slett/skjul element og CSS Inspector er midlertidige. De påvirker bare det du ser i nettleseren din akkurat nå. Ved å laste inn siden på nytt vil alt gå tilbake til sin opprinnelige tilstand.
Åpne DevSuite Pro-popup-vinduet, klikk på Innstillinger-ikonet øverst i høyre hjørne. Rull ned til Lisens-delen, lim inn lisensnøkkelen din i inndatafeltet og klikk på Aktiver. Hvis nøkkelen er gyldig, vil merket endres fra FREE til PRO, og alle pro-verktøy vil bli låst opp umiddelbart.
Du kan flytte dokken ved å gå til Innstillinger og velge en annen sidefeltposisjon – Topp, Bunn, Venstre eller Høyre. Du kan også skjule dokken helt ved å slå av "Vis dokk på sider" i Innstillinger eller trykke på Ctrl+Shift+X når som helst.
Nei. DevSuite Pro samler ikke inn, sporer eller overfører noen av dine nettleserdata. Alle innstillinger lagres lokalt i nettleseren din. Den eneste eksterne forespørselen gjøres under aktivering av lisensnøkkel for å verifisere nøkkelen din mot serveren vår.
Ja! DevSuite Pro er tilgjengelig i både Chrome Web Store og Firefox Add-ons. Det fungerer på Chrome, Edge, Brave og andre Chromium-baserte nettlesere, samt Firefox.