Dodajte proširenje u Chrome
- Otvorite Chrome Web Store i potražite proširenje "DevSuite Pro".
- Kliknite "Dodaj u Chrome" i zatim potvrdite klikom na "Dodaj proširenje" u skočnom prozoru.
64+ moćnih alata za pregledavanje, mjerenje, snimanje, analizu i dizajn web stranica izravno u vašem pregledniku.
Početak je jednostavan. Instalirajte proširenje, otvorite bilo koju web stranicu i pristupite 64+ razvojnih alata iz skočnog prozora ili plutajućeg doka. Nije potrebna konfiguracija.
DevSuite Pro nudi 64+ razvojnih alata za pregledavanje, mjerenje, dizajn i analizu web stranica. Poboljšajte svoj radni tijek s moćnim značajkama ugrađenim izravno u vaš preglednik.
Zadržite pokazivač iznad bilo kojeg elementa kako biste odmah vidjeli i uredili njegove CSS stilove uživo, što olakšava otklanjanje pogrešaka i prilagodbu dizajna u stvarnom vremenu.
Saznajte više →Kliknite na bilo koji element kako biste pregledali njegova svojstva, dimenzije, razmake, fontove i boje. Odmah razumijte strukturu stranice bez otvaranja DevTools preglednika.
Saznajte više →Mjerite udaljenosti, provjeravajte poravnanje i dodajte piksel-savršena ravnala i vodilice na bilo koju web stranicu kako biste osigurali da su vaši dizajni savršeno poravnati.
Saznajte više →Odaberite boje s bilo kojeg elementa na stranici i kopirajte HEX, RGB ili HSL vrijednosti u međuspremnik jednim klikom.
Saznajte više →Snimite cijelu stranicu ili vidljivo područje bilo koje web stranice i odmah je preuzmite — savršeno za dijeljenje dizajna i prijavu grešaka.
Saznajte više →Pregledajte bilo koju web stranicu na različitim veličinama zaslona i rezolucijama uređaja kako biste testirali responzivni dizajn bez napuštanja preglednika.
Saznajte više →Pregledajte i uredite CSS stilove u stvarnom vremenu
CSS Inspector je moćan razvojni alat koji vam omogućuje pregled potpunih CSS svojstava bilo kojeg elementa jednostavnim…
Debugirajte i upravljajte CSS animacijama u stvarnom vremenu
Animation Inspector pruža potpunu kontrolu nad svakom CSS animacijom i transition efektom koji se izvodi na bilo kojoj web stranici.
Pretvorite CSS bilo kojeg elementa u Tailwind utility klase
Copy as Tailwind premošćuje jaz između vizualnog dizajna i Tailwind CSS koda.
Vizualizirajte Cjelokupnu Strukturu Izgleda Bilo Koje Stranice
Outline Only Mode dodaje obrube u boji svakom HTML elementu na web stranici, pružajući vam trenutni pregled strukturnog izgleda stranice.
Dohvatite Kategorizirane Tailwind Klase za Bilo Koji Element
Tailwind Helper pregledava bilo koji element na web stranici i generira sveobuhvatan, kategoriziran pregled…
Vizualni HTML prikaz stabla kao prekrivač na bilo kojoj web stranici
Page Outliner prikazuje cjelokupnu DOM strukturu bilo koje web stranice kao vizualni prekrivač u obliku stabla…
Otkrijte React, Vue, Angular i Svelte komponente na bilo kojoj stranici
Component Detector automatski prepoznaje koji frontend framework web stranica koristi i otkriva njezino cjelokupno stablo komponenti.
Povlecite in spustite za premik kateregakoli elementa
Premakni element vam omogoča, da kliknete na katerikoli element in ga fizično povlečete na novo mesto.
Odstranite ali preklopite vidljivost kateregakoli elementa
Izbriši/Skrij element vam omogoča odstranitev ali začasno skritje kateregakoli elementa z enim klikom.
Izvezite Bilo Koji Element kao HTML, CSS ili JSON
Izvoz Elementa omogućuje vam da kliknete na bilo koji element na web stranici i izvezete njegovu potpunu strukturu u…
Generirajte React, Vue i Svelte Komponente iz Bilo Kojeg Elementa
Kopiranje Koda Komponente pretvara bilo koji element na web stranici u čistu, produkcijski spremnu datoteku komponente…
Snimite vidljivo područje ili cijelu stranicu
Alat Screenshot snima visokokvalitetne slike bilo koje web stranice u dva načina rada: vidljivo područje (točno ono što…
Pregledajte, odaberite i preuzmite sve slike s bilo koje web stranice
Extract Images skenira bilo koju web stranicu i prikazuje svaku sliku u preglednoj galeriji.
Pronađite, pregledajte i preuzmite svaki SVG na bilo kojoj stranici
SVG Grabber otkriva svaki SVG na web stranici — inline SVG elemente, reference na vanjske .svg datoteke, SVG sprite-ove…
Zamijenite bilo koju sliku na stranici vlastitom
Image Replacer vam omogućuje da kliknete bilo koju sliku na web stranici i zamijenite je svojom — bilo učitavanjem…
Generirajte QR kodove za bilo koji URL ili tekst trenutno
QR Code Generator automatski stvara skenirajući QR code za URL trenutne stranice — ili za bilo koji prilagođeni URL ili…
Pixel-precizni ravnali, vodilice i mjerenja na bilo kojoj stranici
Page Ruler dodaje ravnale u stilu Photoshopa i povlačive guide lines na bilo koju web-stranicu.
Pregledajte Više Viewport-ova Uređaja Istovremeno
Responsive Viewer prikazuje trenutnu web stranicu renderiranu u više veličina viewport-a uređaja jednu uz drugu — sve na jednom ekranu.
Izmjerite Točne Pixel Udaljenosti Između Bilo Koja Dva Elementa
Measure Distance omogućuje vam da kliknete bilo koja dva elementa na web stranici i odmah vidite točnu pixel udaljenost…
Vizualizirajte Svaki Stacking Context i Z-Index Sloj
Z-Index Inspector otkriva potpuni redoslijed slaganja svakog elementa na web stranici.
Pregledajte CSS Grid i Flexbox Rasporede s Vizualnim Prekrivačima
Grid/Flex Visualizer otkriva svaki CSS Grid i Flexbox kontejner na web stranici i prikazuje njihovu strukturu rasporeda…
Simulirajte žarišta korisničke pažnje na bilo kojoj stranici
Heatmap Simulator generira prediktivnu heatmap pažnje za bilo koju web stranicu na temelju utvrđenih UX istraživačkih…
Selektivno brisanje cachea, cookieja, localStorage-a i sessionStorage-a
Clear Browsing Data daje programerima brz i selektivan način brisanja određenih vrsta podataka pregledavanja za…
Otkrijte svaku tehnologiju iza bilo koje web stranice
Site Stack skenira bilo koju web stranicu i identificira njen cjeloviti tehnološki skup — frontend okviri (React, Vue…
Celovita SEO revizija: Meta oznake, naslovi, OpenGraph in več
SEO Inšpektor zagotavlja takojšnjo, celovito SEO revizijo katerekoli spletne strani.
Automatska WCAG provjera: contrast ratio, alt text, ARIA i više
Inspektor pristupačnosti provodi automatske WCAG 2.1 Level AA provjere na bilo kojoj web stranici i generira…
Kliknite bilo koji tekst na bilo kojoj stranici i odmah ga uredite
Live Text Editor čini svaki tekstualni element na web stranici editabilnim jednim klikom.
Zamijenite Bilo Koji Font Globalno ili Po Elementu iz Google Fonts
Fonts Changer vam omogućuje zamjenu bilo kojeg fonta na web stranici s drugim iz biblioteke Google Fonts — globalno…
Otkrijte Svaki Font Korišten na Bilo Kojoj Web Stranici
List All Fonts skenira bilo koju web stranicu i prikazuje potpuni popis svake obitelji fontova u upotrebi — web fontovi…
Precizni Eyedropper za HEX, RGB i HSL Vrijednosti Boja
Color Picker pruža pixel-precizan eyedropper alat za odabir boja s bilo kojeg elementa na web stranici — teksta…
Izvucite Kompletnu Paletu Boja s Bilo Koje Web Stranice
Color Palette skenira svaki element na web stranici i izvlači kompletan skup korištenih boja — od teksta i pozadina do…
Trenutno primijeni dark mode na bilo koju web stranicu
Force Dark Mode primjenjuje tamnu shemu boja na svaku web stranicu koja je nema — ili zamjenjuje svijetlu temu stranice.
Trenutno uključite ili isključite JavaScript po kartici
Toggle JavaScript onemogućuje ili ponovo omogućuje izvršavanje JavaScript koda za trenutnu karticu preglednika jednim klikom.
Pregledajte, Uredite, Dodajte i Brišite Cookies za Bilo Koju Domenu
Cookie Editor prikazuje sve cookies za trenutnu domenu u preglednoj, sortabilnoj tablici.
Pregledajte Izlaz Konzole u Plutajućem Panelu — Bez DevTools
Console Logger bilježi sve izlaze konzole (console.log, console.warn, console.error, console.info) i prikazuje ih u…
Pratite sve mrežne zahtjeve u stvarnom vremenu
Network Monitor bilježi i prikazuje svaki mrežni zahtjev koji stranica šalje — XHR/Fetch API pozive, učitavanja…
Pregledajte, uredite, dodajte i obrišite localStorage i sessionStorage
Local Storage Editor pruža čisto tablično sučelje za upravljanje unosima localStorage i sessionStorage za trenutnu stranicu.
Skenirajte sve poveznice na stranici i pronađite neispravne
Provjera neispravnih poveznica skenira svaku poveznicu na trenutnoj stranici — anchor hrefs, izvore slika, izvore…
Trenutačna nadzorna ploča performansi: Vrijeme učitavanja, DOM statistike i resursi
Performanse stranice pružaju trenutačni pregled performansi bilo koje web-stranice — vremenski pokazatelji učitavanja…
Formatirajte, minificirajte i validirajte JSON jednim klikom
JSON Formatter uljepšava, minificira i validira JSON izravno u vašem pregledniku.
Trenutno kodirajte stringove u i iz Base64 formata
Base64 Encoder/Decoder pretvara tekst u Base64 i Base64 natrag u tekst izravno u vašem pregledniku.
Kodirajte i dekodirajte URL stringove jednim klikom
URL Encoder/Decoder pretvara URL stringove u njihov postotno kodirani oblik i natrag.
Trenutno kodirajte i dekodirajte HTML entitete
HTML Entity Encoder pretvara posebne znakove (< > & " ') u njihove HTML entitete (< > & " ') i natrag.
Escapeajte i unescapeajte stringove za kod
Backslash Escape/Unescape pretvara stringove u i iz njihovog escapiranog oblika (\n \t \r \" \' \\ i Unicode escape sekvence).
Pretvorite slike u Base64 Data URI i natrag
Image ↔ Base64 pretvara slikovne datoteke (PNG, JPG, SVG, WebP, GIF) u Base64-kodirane data URI-je i natrag.
Trenutno dekodirajte JSON Web tokene
JWT Debugger dekodira i pregledava JSON Web tokene — raščlanjuje zaglavlje, payload i potpis, prikazuje tvrdnje…
Generirajte skupine UUID v4 identifikatora
UUID Generator generira kriptografski jake UUID v4 identifikatore koristeći crypto API preglednika.
Izračunajte MD5, SHA-1, SHA-256, SHA-384, SHA-512 hasheve
Hash Generator izračunava kriptografske hasheve (MD5, SHA-1, SHA-256, SHA-384, SHA-512) bilo kojeg tekstualnog unosa.
Generirajte kriptografski jake lozinke
Password Generator generira jake, nasumične lozinke koristeći kriptografski API slučajnosti preglednika.
Testirajte regularne izraze uživo uz isticanje podudaranja
Regex Tester procjenjuje regularne izraze nad testnim tekstom u stvarnom vremenu.
Pretvarajte Unix, ISO i čitljive datume
Timestamp Converter pretvara između Unix vremenskih oznaka (sekunde, milisekunde, mikrosekunde, nanosekunde), ISO 8601…
Usporedite dva bloka teksta redak po redak
Diff Tool uspoređuje dva bloka teksta i ističe dodane, uklonjene i nepromijenjene retke uz izlaz označen bojama.
Provjerite WCAG omjer kontrasta bilo koje dvije boje
Contrast Checker izračunava WCAG 2.1 omjer kontrasta između dvije boje i ocjenjuje ih prema AA/AAA pragovima za normalan i velik tekst.
Trenutno pretvarajte HEX, RGB, HSL, HSV i OKLCH
Color Format Converter pretvara bilo koju boju između HEX, RGB, HSL, HSV i OKLCH formata.
Izdvojite dominantnu paletu boja iz bilo koje slike
Ekstraktor boja iz slike analizira bilo koju sliku (povucite, zalijepite ili kliknite za učitavanje) i vraća do 16…
Dobijte CSS selektore i XPath za bilo koji element
DOM Path Finder omogućuje vam da lebdenjem mišem preko bilo kojeg elementa na stranici otkrijete njegov jedinstveni CSS…
Testirajte zahtjeve različitog podrijetla i pregledajte CORS zaglavlja
CORS provjera testira hoće li ciljani server dopustiti zahtjev različitog podrijetla (cross-origin) s vaše stranice.
Snimajte WebSocket okvire u stvarnom vremenu
WebSocket Inspector snima svaki WebSocket okvir — poslani i primljeni — na svim vezama na stranici.
Trenutačno pretražite stranicu za oštećenim slikama
Pronalazač oštećenih slika pretražuje svaki <img> element i CSS background-image na stranici, otkriva neuspjela…
Automatski Ispunite Obrasce Realističnim Testnim Podacima
Form Filler popunjava svako vidljivo polje obrasca na stranici realističnim testnim podacima — ime, e-pošta, telefon…
Pretvarajte Između CSV i JSON u Oba Smjera
CSV ↔ JSON Pretvarač obavlja potpunu dvosmjernu konverziju između dva najčešća tabelarna formata.
Formatirajte, Validirajte i Pregledajte XML sa Sintaksnim Isticanjem
XML Formatter uljepšava, minificira i validira XML izravno u pregledniku.
Uljepšajte i Formatirajte SQL Upite
SQL Formatter pretvara minificiran ili nepregledan SQL u čitljive, uvučene upite.
Spremite Web Stranice Kao Čiste PDF-ove
Convert to PDF sprema trenutnu web stranicu kao PDF putem dijaloga za ispis preglednika, uz prethodnu primjenu stilova prilagođenih ispisu.
Odaberite plan koji odgovara vašem radnom tijeku. Započnite besplatno, nadogradite bilo kada.
Uobičajena pitanja o značajkama i korištenju proširenja DevSuite Pro. Ako imate pitanje, odgovor se možda već nalazi u nastavku.
Posjetite Chrome Web Store, potražite "DevSuite Pro", kliknju "Dodaj u Chrome" i potvrdite odabirom "Dodaj proširenje". Nakon instalacije, ikona proširenja pojavit će se na alatnoj traci vašeg preglednika. Kliknite na nju za trenutni pristup 64+ razvojnih alata.
Besplatni alati (43+) dostupni su svima bez potrebe za licencom. Pro alati označeni su zlatnom PRO značkom i zahtijevaju aktivnu Pro licencu za korištenje. Iz skočnog prozora možete vidjeti koji su alati besplatni, a koji pro — besplatni alati nemaju ikonu zaključavanja, dok su pro alati malo zatamnjeni dok ne aktivirate svoju licencu.
Neke web stranice imaju stroge politike sigurnosti sadržaja (CSP) koje blokiraju određene radnje proširenja preglednika. To je posebno uobičajeno na bankovnim i državnim stranicama. Također, interne Chrome stranice (chrome://) ne dopuštaju proširenjima pokretanje skripti sadržaja.
Ne. Sve promjene napravljene alatima poput Premjesti element, Uređivač teksta uživo, Izbriši/Sakrij element i CSS Inspector su privremene. Utječu samo na ono što vidite u svom pregledniku upravo sada. Ponovno učitavanje stranice vratit će sve u izvorno stanje.
Otvorite skočni prozor DevSuite Pro, kliknite ikonu Postavki u gornjem desnom kutu. Pomaknite se do odjeljka Licenca, zalijepite svoj licencni ključ u polje za unos i kliknite Aktiviraj. Ako je ključ valjan, značka će se promijeniti iz FREE u PRO i svi pro alati odmah će se otključati.
Dok možete premjestiti odlaskom u Postavke i odabirom drugog položaja bočne trake — Gore, Dolje, Lijevo ili Desno. Dok također možete potpuno sakriti isključivanjem "Prikaži dok na stranicama" u Postavkama ili pritiskom Ctrl+Shift+X u bilo kojem trenutku.
Ne. DevSuite Pro ne prikuplja, ne prati niti ne prenosi vaše podatke o pregledavanju. Sve postavke pohranjuju se lokalno u vašem pregledniku. Jedini vanjski zahtjev upućuje se tijekom aktivacije licencnog ključa za provjeru vašeg ključa na našem poslužitelju.
Da! DevSuite Pro dostupan je i u Chrome Web Store i u Firefox Add-ons. Radi u Chrome, Edge, Brave i drugim preglednicima temeljenima na Chromiumu, kao i u Firefoxu.