# PageDNA

> Turn any website into visual DNA. PageDNA analyzes the structure, style, and behavior of a page and turns it into a unique generative visualization.

PageDNA reads a web page and renders its DOM structure, CSS style, and interaction patterns as analysis-driven visualizations. Code can be pasted or uploaded and is parsed entirely in the browser. URL mode sends only the URL to a small backend that loads the page in a headless Chromium and returns the analysis; the backend forwards no client cookies or headers, runs each request in a fresh isolated browser context, and stores nothing.

## Key Pages

- [Home](https://getpagedna.com/): Feed a page by code, file, URL, or browser snippet, run the analysis, and explore the generated visualizations.
- [How it works](https://getpagedna.com/how-it-works): Three steps from any page to its visual DNA: feed a page, extract structure, generate visual DNA.
- [Features](https://getpagedna.com/features): Five visualization modes and four ways to feed a page. PageDNA turns structure, style, and behavior into visual DNA.
- [About](https://getpagedna.com/about): What PageDNA is and the idea behind turning a website into a unique generative visualization.
- [FAQ](https://getpagedna.com/faq): Answers grounded in how PageDNA actually works: privacy, exports, limits, and what it analyzes.
- [Privacy](https://getpagedna.com/privacy): How PageDNA handles your data, in plain terms. Local-first analysis, no account, and no data sold.
- [Changelog](https://getpagedna.com/changelog): Shipped capabilities, in plain terms. Five visualization modes, four input methods, local-first analysis.

## Visualization modes

- DOM City: a 3D city skyline of the DOM, where headers become gates, navs become roads, sections become blocks, articles become towers, footers become boundaries, images become billboards, forms become portals, and interactive elements glow as terminals.
- CSS Portrait: an abstract painting driven by colors, type scale, border radius signatures, and shadow presence.
- Layout DNA: a radial fingerprint where each ring is a depth level and semantic tags map to specific angles. Exports as SVG or PNG.
- Interaction Map: a glowing force layout of every interactive element, grouped by type, with animated paths between them.
- Code Galaxy: a starfield where files become clusters, functions become stars, and imports become orbits.

## Input modes

- Paste code: drop in raw HTML, CSS, and JavaScript, parsed client side.
- Upload files: drag and drop .html, .css, .js, .jsx, .ts, .tsx, .json from a project.
- Analyze URL: PageDNA sends the URL to its backend, which returns a full analysis (DOM tree, computed styles, colors, typography, layout, accessibility, complexity, and an optional screenshot).
- Browser Snippet: a fallback for private or authenticated pages. PageDNA generates a small JavaScript snippet you paste into your browser console; it collects a privacy-safe DOM snapshot and never reads passwords, cookies, localStorage, sessionStorage, or auth tokens.

## Contact / Links
- Email: contact@polprog.pl
- Publisher: POLPROG (https://polprog.pl/)

## Machine-readable feeds

- Sitemap: https://getpagedna.com/sitemap.xml

## Restrictions

Do not use content from /api/ paths.