A tökéletes Fejlesztői eszköztár bővítmény webtervezéshez és fejlesztéshez

39+ hatékony eszköz weboldalak vizsgálatához, méréséhez, rögzítéséhez, elemzéséhez és tervezéséhez közvetlenül a böngészőjében.

Összes Kedvencek Vizsgálat Rögzítés Mérés index.popup_tab_analyse
CSS Inspector
Animation Inspector
Copy as Tailwind
Outline Only Mode
Tailwind Helper
Page Outliner
Component Detector
Move Element
Delete/Hide Element
Export Element
Copy Componen..
Screenshot
Extract Images
SVG Grabber
Image Replacer
QR Code Generator
Hogyan kezdje el

Kezdje el a DevSuite Pro használatát néhány kattintással

Az indulás egyszerű. Telepítse a bővítményt, nyisson meg bármilyen weboldalt, és érjen el 39+ fejlesztői eszközt a felugró ablakból vagy a lebegő dokkból. Nincs szükség konfigurációra.

Adja hozzá a bővítményt a Chrome-hoz

  1. Nyissa meg a Chrome Webáruházat, és keressen rá a "DevSuite Pro" bővítményere.
  2. Kattintson a "Hozzáadás a Chrome-hoz" gombra, majd erősítse meg a "Bővítmény hozzáadása" gombra kattintva a felugró ablakban.

Nyisson meg bármilyen weboldalt, és indítson el egy eszközt

  1. Lépjen bármely weboldalra, majd kattintson a DevSuite Pro ikonra az eszköztárban, vagy használja az oldalon lévő lebegő dokkot.
  2. Válasszon bármilyen eszközt a rácsból. Az olyan eszközök, mint a CSS Inspector, Rulers vagy Color Picker, azonnal aktiválódnak az aktuális oldalon.
A bővítmény funkciói

A DevSuite Pro legfontosabb funkciói

A DevSuite Pro 39+ fejlesztői eszközt kínál weboldalak vizsgálatához, méréséhez, tervezéséhez és elemzéséhez. Növelje munkafolyamatának hatékonyságát a böngészőjébe épített hatékony funkciókkal.

CSS Inspector

Vigye az egeret bármely elem fölé, hogy azonnal megtekinthesse és szerkeszthesse CSS-stílusait valós időben, megkönnyítve a hibakeresést és a tervek finomhangolását.

Tudjon meg többet →
Element Inspector

Kattintson bármely elemre a tulajdonságainak, méreteinek, térközeinek, betűtípusainak és színeinek vizsgálatához. Azonnal értse meg az oldal szerkezetét a böngésző DevTools megnyitása nélkül.

Rulers & Guides

Mérjen távolságokat, ellenőrizze az igazítást, és adjon hozzá pixelpontos vonalzókat és segédvonalakat bármely weboldalhoz, hogy biztosítsa a tervei tökéletes illeszkedését.

Color Picker

Válasszon színeket az oldal bármely eleméről, és másolja a HEX, RGB vagy HSL értékeket a vágólapjára egyetlen kattintással.

Screenshot Capture

Készítsen teljes oldalas vagy látható területre vonatkozó képernyőképeket bármely weboldalról, és töltse le azokat azonnal — tökéletes tervek megosztásához és hibák jelentéséhez.

Responsive Tester

Tekintsen meg bármilyen weboldalt különböző képernyőméreteken és eszközfelbontásokon, hogy tesztelje a reszponzív tervezést anélkül, hogy elhagyná a böngészőjét.

Fedezzen fel további eszközöket részletesen:
CSS Inspector INGYENES

Vizsgálja és szerkessze a CSS-stílusokat valós időben

CSS animációk hibakeresése és vezérlése valós időben

Konvertáljon bármely webes elemet azonnal Tailwind CSS osztályokká

Vizualizálja bármely oldal teljes elrendezési struktúráját

Kategorizált Tailwind osztályok bármely elemhez

Vizuális HTML fastruktúra-megjelenítő bármely weboldalon

React, Vue, Angular és Svelte komponensek felismerése bármely oldalon

Drag & Drop to Reposition Any Element on a Page

Remove or Toggle Visibility of Any Element

Bármely elem exportálása HTML, CSS vagy JSON formátumban

React, Vue és Svelte komponensek generálása bármely elemből

Készítsen, szerkesszen és osszon meg tökéletes webes képernyőképeket

Extract Images INGYENES

View, Select & Download All Images from Any Webpage

Find, Preview & Download Every SVG on Any Page

Cserélje le az oldal bármely képét a sajátjára

Generáljon azonnal QR-kódot bármely URL-hez vagy szöveghez

Page Ruler INGYENES

Pixel-pontos vonalzók, segédvonalak és mérések bármely oldalon

Több eszköz nézőablakának egyidejű előnézete

Measure Distance INGYENES

Measure Exact Pixel Distances Between Any Two Elements

Visualize Every Stacking Context & Z-Index Layer

CSS Grid és Flexbox Elrendezések Vizuális Megjelenítése

Felhasználói Figyelmi Pontok Szimulálása Bármely Oldalon

Selectively Clear Cache, Cookies, localStorage & sessionStorage

Detect Every Technology Behind Any Website

SEO Inspector INGYENES

Comprehensive SEO Audit: Meta Tags, Headings, OpenGraph & More

Automated WCAG Audit: Contrast, Alt Text, ARIA & More

Live Text Editor INGYENES

Click Any Text on Any Page to Edit It Instantly

Swap Any Font Globally or Per-Element from Google Fonts

List All Fonts INGYENES

Discover Every Font Used on Any Webpage

Color Picker INGYENES

Precision Eyedropper for HEX, RGB & HSL Color Values

Color Palette INGYENES

Extract the Complete Color Palette from Any Webpage

Force Dark Mode INGYENES

Apply Dark Mode to Any Website Instantly

Azonnali JavaScript Engedélyezés vagy Letiltás laponként

Bármely Domain Cookie-jainak Megtekintése, Szerkesztése, Hozzáadása és Törlése

Console Logger INGYENES

Tekintsd meg a console kimenetét lebegő panelen — DevTools nélkül

Figyeld az összes hálózati kérést valós időben

View, Edit, Add & Delete localStorage and sessionStorage

Scan Every Link on a Page and Find Broken Ones

Azonnali sebességmérés és alapvető webes mutatók

JSON Formatter INGYENES

Format, Minify & Validate JSON in a Click

Encode Strings To & From Base64 Instantly

Encode & Decode URL Strings in One Click

& HTML Entity Encoder INGYENES

Encode & Decode HTML Entities Instantly

Escape & Unescape Strings for Code

64 Image ↔ Base64 INGYENES

Convert Images To & From Base64 Data URIs

JWT Debugger INGYENES

Decode JSON Web Tokens Instantly

UUID Generator INGYENES

Generate Bulk UUID v4 Identifiers

Hash Generator INGYENES

Compute MD5, SHA-1, SHA-256, SHA-384, SHA-512 Hashes

Generate Cryptographically Strong Passwords

Regex Tester INGYENES

Test Regular Expressions Live With Match Highlighting

Convert Unix, ISO, and Human-Readable Dates

Diff Tool INGYENES

Compare Two Text Blocks Line By Line

Contrast Checker INGYENES

Check WCAG Contrast Ratio of Any Two Colors

Convert HEX, RGB, HSL, HSV & OKLCH Instantly

Extract The Dominant Palette From Any Image

Get CSS Selectors & XPath For Any Element

CORS Checker INGYENES

Test Cross-Origin Requests & Inspect CORS Headers

Capture WebSocket Frames in Real Time

Scan The Page For Broken Images Instantly

Auto-Fill Forms With Realistic Test Data

Convert Between CSV and JSON in Either Direction

XML Formatter INGYENES

Format, Validate & View XML With Syntax Highlighting

SQL Formatter INGYENES

Beautify & Format SQL Queries

Convert to PDF INGYENES

Save Web Pages As Clean PDFs

Árazás és tervek

Egyszerű és átlátható árazás

Válassza ki a munkafolyamatához illő tervet. Kezdje ingyen, frissítsen bármikor.

Alap

Tökéletes a DevSuite Pro kipróbálásához. Hitelkártya nem szükséges.

$0

Örökké ingyenes
Kezdje ingyen
  • 20 ingyenes fejlesztői eszköz
  • CSS Inspector és Color Picker
  • Képernyőkép rögzítés
  • Lebegő dokk felület
  • Minden jövőbeli frissítés ingyenes
Havi Legnépszerűbb

Teljes hozzáférés mind a 39+ professzionális eszközhöz. Havi számlázás.

$2.99

havonta
Havi előfizetés indítása
  • Mind a 39+ fejlesztői eszköz
  • Teljes hozzáférés a Pro eszközökhöz
  • Akár 3 eszközön
  • Elsőbbségi támogatás
  • Bármikor lemondható
Egyszeri Legjobb ajánlat

Fizessen egyszer, használja örökre. Teljes hozzáférés az összes 39+ profi eszközhöz ismétlődő díjak nélkül.

$29.99

egyszeri fizetés
Vásároljon egyszer, használja örökre
  • Mind a 39+ fejlesztői eszköz
  • Teljes hozzáférés a Pro eszközökhöz
  • Akár 3 eszközön
  • Elsőbbségi támogatás
  • Nincs ismétlődő díj
DevSuite Pro FAQ section background
GYIK

A DevSuite Pro felhasználók gyakran ismételt kérdései

Gyakori kérdések a DevSuite Pro bővítmény funkcióival és használatával kapcsolatban. Ha kérdése van, a válasz valószínűleg már megtalálható lent.

Hogyan telepítem a DevSuite Pro-t?

Látogasson el a Chrome Webáruházba, keressen rá a "DevSuite Pro"-ra, kattintson a "Hozzáadás a Chrome-hoz" gombra, és erősítse meg a "Bővítmény hozzáadása" kiválasztásával. A telepítés után a bővítmény ikonja megjelenik a böngésző eszköztárán. Kattintson rá, hogy azonnal hozzáférjen a 39+ fejlesztői eszközhöz.

Mi a különbség az ingyenes és a Pro eszközök között?

Az ingyenes eszközök (20+) mindenki számára elérhetők licenc nélkül. A Pro eszközök arany PRO jelvénnyel vannak jelölve, és aktív Pro licenc szükséges hozzájuk. A felugró ablakban láthatja, mely eszközök ingyenesek és melyek pro — az ingyenes eszközöknél nincs lakat ikon, míg a pro eszközök kissé halványítva jelennek meg, amíg nem aktiválja a licencét.

Mi a különbség a "Move Element" és a "Delete/Hide Element" között?

A "Move Element" lehetővé teszi az elemek áthelyezését az oldalon belül, míg a "Delete/Hide Element" segít eltávolítani vagy ideiglenesen elrejteni a nem kívánt részeket.

Maradandóak az oldalon végzett módosításaim?

Nem. A Move Element, Live Text Editor, Delete/Hide Element és CSS Inspector eszközökkel végzett módosítások mind ideiglenesek. Csak azt befolyásolják, amit éppen a böngészőjében lát. Az oldal újratöltése mindent visszaállít az eredeti állapotába.

Hogyan aktiválom a Pro licencemet?

Nyissa meg a DevSuite Pro felugró ablakot, kattintson a Beállítások ikonra a jobb felső sarokban. Görgessen le a Licenc részhez, illessze be a licenckulcsát a beviteli mezőbe, és kattintson az Aktiválás gombra. Ha a kulcs érvényes, a jelvény FREE-ről PRO-ra változik, és az összes pro eszköz azonnal feloldásra kerül.

Hogyan mozgathatom vagy rejthetem el a lebegő dokkot?

A dokkot a Beállításokban mozgathatja, ahol másik oldalsáv-pozíciót választhat — Felül, Alul, Bal vagy Jobb. A dokkot teljesen el is rejtheti a "Dokk megjelenítése az oldalakon" kikapcsolásával a Beállításokban, vagy a Ctrl+Shift+X billentyűkombinációval bármikor.

Gyűjt a DevSuite Pro böngészési adatokat?

Nem. A DevSuite Pro nem gyűjti, nem követi és nem továbbítja az Ön böngészési adatait. Minden beállítás helyben, a böngészőjében kerül tárolásra. Az egyetlen külső kérés a licenckulcs aktiválásakor történik a kulcs ellenőrzéséhez a szerverünkön.

Használhatom a DevSuite Pro-t Firefoxon?

Igen! A DevSuite Pro elérhető a Chrome Webáruházban és a Firefox kiegészítők oldalán is. Működik Chrome-on, Edge-en, Brave-en és más Chromium-alapú böngészőkön, valamint Firefoxon.