From 7aefdc3848023db1dd5c339ebf00b4e134f11219 Mon Sep 17 00:00:00 2001 From: Ku6epXBOCTuK Date: Sat, 12 Sep 2026 18:54:11 +0500 Subject: [PATCH] chore: cleanup - remove old references and audit scripts --- refs-html/README.md | 42 - .../ibm-plex-mono-cyrillic-400-normal.woff2 | Bin 8356 -> 0 bytes .../ibm-plex-mono-cyrillic-500-normal.woff2 | Bin 8460 -> 0 bytes ...bm-plex-mono-cyrillic-ext-400-normal.woff2 | Bin 6912 -> 0 bytes ...bm-plex-mono-cyrillic-ext-500-normal.woff2 | Bin 6972 -> 0 bytes .../ibm-plex-mono-latin-400-normal.woff2 | Bin 14708 -> 0 bytes .../ibm-plex-mono-latin-500-normal.woff2 | Bin 14888 -> 0 bytes .../ibm-plex-mono-latin-ext-400-normal.woff2 | Bin 13348 -> 0 bytes .../ibm-plex-mono-latin-ext-500-normal.woff2 | Bin 13432 -> 0 bytes .../ibm-plex-mono-vietnamese-400-normal.woff2 | Bin 5868 -> 0 bytes .../ibm-plex-mono-vietnamese-500-normal.woff2 | Bin 6040 -> 0 bytes .../ibm-plex-sans-cyrillic-400-normal.woff2 | Bin 14800 -> 0 bytes .../ibm-plex-sans-cyrillic-500-normal.woff2 | Bin 15000 -> 0 bytes .../ibm-plex-sans-cyrillic-600-normal.woff2 | Bin 15040 -> 0 bytes .../ibm-plex-sans-cyrillic-700-normal.woff2 | Bin 14572 -> 0 bytes ...bm-plex-sans-cyrillic-ext-400-normal.woff2 | Bin 12148 -> 0 bytes ...bm-plex-sans-cyrillic-ext-500-normal.woff2 | Bin 12308 -> 0 bytes ...bm-plex-sans-cyrillic-ext-600-normal.woff2 | Bin 12304 -> 0 bytes ...bm-plex-sans-cyrillic-ext-700-normal.woff2 | Bin 12056 -> 0 bytes .../ibm-plex-sans-greek-400-normal.woff2 | Bin 9940 -> 0 bytes .../ibm-plex-sans-greek-500-normal.woff2 | Bin 10376 -> 0 bytes .../ibm-plex-sans-greek-600-normal.woff2 | Bin 10368 -> 0 bytes .../ibm-plex-sans-greek-700-normal.woff2 | Bin 9928 -> 0 bytes .../ibm-plex-sans-latin-400-normal.woff2 | Bin 22588 -> 0 bytes .../ibm-plex-sans-latin-500-normal.woff2 | Bin 24184 -> 0 bytes .../ibm-plex-sans-latin-600-normal.woff2 | Bin 24252 -> 0 bytes .../ibm-plex-sans-latin-700-normal.woff2 | Bin 22832 -> 0 bytes .../ibm-plex-sans-latin-ext-400-normal.woff2 | Bin 15980 -> 0 bytes .../ibm-plex-sans-latin-ext-500-normal.woff2 | Bin 16456 -> 0 bytes .../ibm-plex-sans-latin-ext-600-normal.woff2 | Bin 16448 -> 0 bytes .../ibm-plex-sans-latin-ext-700-normal.woff2 | Bin 16188 -> 0 bytes .../ibm-plex-sans-vietnamese-400-normal.woff2 | Bin 8204 -> 0 bytes .../ibm-plex-sans-vietnamese-500-normal.woff2 | Bin 8416 -> 0 bytes .../ibm-plex-sans-vietnamese-600-normal.woff2 | Bin 8460 -> 0 bytes .../ibm-plex-sans-vietnamese-700-normal.woff2 | Bin 8220 -> 0 bytes refs-html/background-remover.html | 2552 -- refs-html/demo.html | 2910 -- refs-html/gradient.html | 2547 -- refs-html/list-tools.html | 3274 -- refs/.gitignore | 15 - .../background-remover/page.tsx | 29 - refs/app/easy-png-tools/demo/page.tsx | 1 - refs/app/easy-png-tools/gradient/page.tsx | 33 - refs/app/easy-png-tools/list-tools/page.tsx | 28 - refs/app/globals.css | 15 - refs/app/layout.tsx | 18 - refs/app/page.tsx | 40 - refs/components.json | 21 - refs/components/top-bar.tsx | 36 - refs/components/ui/button.tsx | 58 - refs/lib/utils.ts | 6 - refs/next-env.d.ts | 7 - refs/next.config.mjs | 11 - refs/package.json | 37 - refs/pnpm-lock.yaml | 3928 -- refs/pnpm-workspace.yaml | 2 - refs/postcss.config.mjs | 8 - refs/public/placeholder-user.jpg | Bin 1635 -> 0 bytes refs/public/placeholder.jpg | Bin 1064 -> 0 bytes refs/public/placeholder.svg | 1 - refs/tsconfig.json | 33 - scripts/extract-static.mjs | 252 - web/audit/audit-report.json | 33771 ---------------- web/audit/audit-report.md | 5364 --- web/audit/dom-report.json | 57 - web/audit/dom-report.md | 47 - web/scripts/archive/audit-cdp-responsive.mjs | 30 - web/scripts/archive/audit-cdp.mjs | 1486 - web/scripts/archive/audit-css.mjs | 523 - web/scripts/archive/audit-dom.mjs | 415 - 70 files changed, 57597 deletions(-) delete mode 100644 refs-html/README.md delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-cyrillic-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-cyrillic-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-cyrillic-ext-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-cyrillic-ext-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-latin-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-latin-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-latin-ext-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-latin-ext-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-vietnamese-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-mono-vietnamese-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-700-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-ext-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-ext-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-ext-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-cyrillic-ext-700-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-greek-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-greek-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-greek-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-greek-700-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-700-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-ext-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-ext-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-ext-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-latin-ext-700-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-vietnamese-400-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-vietnamese-500-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-vietnamese-600-normal.woff2 delete mode 100644 refs-html/assets/fonts/ibm-plex-sans-vietnamese-700-normal.woff2 delete mode 100644 refs-html/background-remover.html delete mode 100644 refs-html/demo.html delete mode 100644 refs-html/gradient.html delete mode 100644 refs-html/list-tools.html delete mode 100644 refs/.gitignore delete mode 100644 refs/app/easy-png-tools/background-remover/page.tsx delete mode 100644 refs/app/easy-png-tools/demo/page.tsx delete mode 100644 refs/app/easy-png-tools/gradient/page.tsx delete mode 100644 refs/app/easy-png-tools/list-tools/page.tsx delete mode 100644 refs/app/globals.css delete mode 100644 refs/app/layout.tsx delete mode 100644 refs/app/page.tsx delete mode 100644 refs/components.json delete mode 100644 refs/components/top-bar.tsx delete mode 100644 refs/components/ui/button.tsx delete mode 100644 refs/lib/utils.ts delete mode 100644 refs/next-env.d.ts delete mode 100644 refs/next.config.mjs delete mode 100644 refs/package.json delete mode 100644 refs/pnpm-lock.yaml delete mode 100644 refs/pnpm-workspace.yaml delete mode 100644 refs/postcss.config.mjs delete mode 100644 refs/public/placeholder-user.jpg delete mode 100644 refs/public/placeholder.jpg delete mode 100644 refs/public/placeholder.svg delete mode 100644 refs/tsconfig.json delete mode 100644 scripts/extract-static.mjs delete mode 100644 web/audit/audit-report.json delete mode 100644 web/audit/audit-report.md delete mode 100644 web/audit/dom-report.json delete mode 100644 web/audit/dom-report.md delete mode 100644 web/scripts/archive/audit-cdp-responsive.mjs delete mode 100644 web/scripts/archive/audit-cdp.mjs delete mode 100644 web/scripts/archive/audit-css.mjs delete mode 100644 web/scripts/archive/audit-dom.mjs diff --git a/refs-html/README.md b/refs-html/README.md deleted file mode 100644 index 42a0262..0000000 --- a/refs-html/README.md +++ /dev/null @@ -1,42 +0,0 @@ -# refs-html — статические снимки нового дизайна - -Отформатированный HTML, вытащенный из Next-референса `refs/`, чтобы смотреть -макеты как референс по разметке и классам: открыл файл в браузере — увидел -дизайн. - -## Файлы - -| Файл | Маршрут в нашем приложении (audit) | Что показывает | -| ------------------------- | -------------------------------------- | --------------------------------------------------- | -| `demo.html` | `/preview/demo` | Пайплайн-воркспейс + панель превью | -| `list-tools.html` | `/preview/list-tools` | Каталог инструментов (группы, поиск, фильтры) | -| `gradient.html` | `/preview/tools/linear-gradient-png` | Инструмент «Градиент»: настройки + превью + CSS | -| `background-remover.html` | `/preview/tools/remove-background-png` | Инструмент «Удаление фона»: сравнение source/result | - -> `index.html` не используется: в Next-рефе это зеркало `demo` (главная == `/easy-png-tools/demo`), -> а в нашем приложении `/preview` — своя страница (воркспейс). Файл не генерируется -> экстрактором (`scripts/extract-static.mjs` пропускает `index.html`) и исключён -> из аудита (`EXCLUDE` в `web/scripts/audit.mjs`). - -## Особенности - -- **Это статика без JS**: все ` - - - \ No newline at end of file diff --git a/refs-html/demo.html b/refs-html/demo.html deleted file mode 100644 index e5cfbf3..0000000 --- a/refs-html/demo.html +++ /dev/null @@ -1,2910 +0,0 @@ - - - - - - - - - - easy-png-tools / Demo - - - - - - -
-
- - EP - - easy-png-tools - - / - WORKSPACE - - - -
- - - - AUTO PIPELINE - - - -
- - / - - -
-
-
-
-
-
PNG PROCESSING - / - WORKSPACE -
-
-
-

Build your image pipeline. -

-

Chain simple tools together. Every change is processed automatically and previewed at each stage. -

-
-
- - source.png - - 1.8 MB - -
-
-
-
- PROCESSING PIPELINE - - 4 - active steps - • LIVE - - -
- -
-
-
-
01 -
- -
-
-
- BACKGROUND - -

Gradient background -

-
-
- - AUTO - - - -
-
-
-
- -
- - - - -
-
-
- - -
-
- -
- - - - -
-
-
-
-
-
-
02 -
- -
-
-
- TRANSFORM - -

Remove background -

-
-
- - AUTO - - - -
-
-
- Automatic subject detection enabled -
-
-
-
-
03 -
- -
-
-
- STYLE - -

Add outline -

-
-
- - AUTO - - - -
-
-
-
- - -
-
- -
- - - -
-
-
-
-
-
-
04 -
- -
-
-
- STYLE - -

Round corners -

-
-
- - AUTO - - - -
-
-
-
- - -
-
- Preserve aspect ratio - - -
-
-
-
-
- -
-
-
-
- PIPELINE OUTPUTS - - Visual history - -
-
- - -
-
- DIMENSIONS - - 1200 × 800 px - -
-
- FORMAT - - PNG-24 - -
-
- SIZE - - 1.2 MB - -
-
- -
-
-
-
-
-
- PNG - - easy-png-tools - -
-
-
- SOURCE - - original.png · 1200 × 800 - -
-
-
-
-
- PNG - - easy-png-tools - -
-
-
- STEP 01 - - gradient applied - -
-
-
-
-
- PNG - - easy-png-tools - -
-
-
- STEP 02 - - background removed - -
-
-
-
-
- PNG - - easy-png-tools - -
-
-
- STEP 03 - - outline added - -
-
-
-
-
- PNG - - easy-png-tools - -
-
-
- FINAL OUTPUT - - ready · PNG-24 - -
-
-
-

Output is generated in-browser. Your files never leave this device. -

-
-
-
- easy-png-tools - v2.4.0 - - - - pipeline is local-only - - © 2024 - -
-
- - - - - - - - - - \ No newline at end of file diff --git a/refs-html/gradient.html b/refs-html/gradient.html deleted file mode 100644 index 001fbd9..0000000 --- a/refs-html/gradient.html +++ /dev/null @@ -1,2547 +0,0 @@ - - - - - - - - - - easy-png-tools / Demo - - - - - - -
-
- - EP - - easy-png-tools - - / - GRADIENT - - - -
- - - - LIVE PREVIEW - - - -
- - / - - -
-
-
-
-
PNG PROCESSING - / - SINGLE TOOL -
-
-
-

Gradient background. -

-

Create a clean, export-ready gradient with precise control over color, direction and transparency. -

-
- - - LIVE PREVIEW - -
-
-
-
-
- GRADIENT SETTINGS - - Configure output - -
- TOOL 01 - -
-
- -
- - -
-
-
- -
-
- - - -
- → - -
- - - -
-
-
-
-
-
- - -
- - - - - - - - -
-
-
- - -
- -
-
-
-
- OUTPUT PREVIEW - - gradient.png - -
-
- - -
-
-
-
-
PNG -
- easy-png-tools - -
-
-
-
- GENERATED CSS - - -
-
background: linear-gradient(135deg, #1769D2 0%, #00A8C7 100%);
-opacity: 1;
-
-
-
-
-
- easy-png-tools - v2.4.0 - - - gradient tool · local-only - - © 2024 - -
-
- - - - - - - - - - \ No newline at end of file diff --git a/refs-html/list-tools.html b/refs-html/list-tools.html deleted file mode 100644 index d37f588..0000000 --- a/refs-html/list-tools.html +++ /dev/null @@ -1,3274 +0,0 @@ - - - - - - - - - - easy-png-tools / Demo - - - - - - -
-
- - EP - - easy-png-tools - - / - CATALOG - - - -
- - - - LOCAL MODE / READY - - - -
- - / - - -
-
-
-
-
-
-
EASY-PNG-TOOLS / CATALOG -
-

Tool catalog -

-

Focused utilities for working with PNG. Inspect, transform, and export — locally in your browser. -

-
-
- 32 - - TOOLS -
AVAILABLE -
-
-
-
- -
- - - - - - - - -
-
-
-
-
- CONVERT - - 05 - TOOLS - -
- -
-
-
- TRANSPARENCY - - 05 - TOOLS - -
- -
-
-
- COLOR - - 05 - TOOLS - -
- -
-
-
- GEOMETRY - - 05 - TOOLS - -
- -
-
-
- FILTERS - - 04 - TOOLS - -
- -
-
-
- ANALYZE - - 04 - TOOLS - -
- -
-
-
ALL OPERATIONS RUN LOCALLY - • - YOUR FILES NEVER LEAVE THIS DEVICE -
-
-
- - - - - - - - - - \ No newline at end of file diff --git a/refs/.gitignore b/refs/.gitignore deleted file mode 100644 index 97eb8c0..0000000 --- a/refs/.gitignore +++ /dev/null @@ -1,15 +0,0 @@ -# v0 sandbox internal files -__v0_runtime_loader.js -__v0_devtools.tsx -__v0_jsx-dev-runtime.ts -.snowflake/ -.v0-trash/ -.vercel/ - -# Environment variables -.env*.local - -# Common ignores -node_modules -.next/ -.DS_Store \ No newline at end of file diff --git a/refs/app/easy-png-tools/background-remover/page.tsx b/refs/app/easy-png-tools/background-remover/page.tsx deleted file mode 100644 index 3de1776..0000000 --- a/refs/app/easy-png-tools/background-remover/page.tsx +++ /dev/null @@ -1,29 +0,0 @@ -'use client' - -import TopBar from '@/components/top-bar' -import { useMemo, useState } from 'react' -import { Download, RotateCcw, Upload, Check } from 'lucide-react' - -export default function BackgroundRemoverPage() { - const [color, setColor] = useState('#E8EEF2') - const [similarity, setSimilarity] = useState(72) - const [outerOnly, setOuterOnly] = useState(true) - const [showMask, setShowMask] = useState(false) - const [downloaded, setDownloaded] = useState(false) - const previewBackground = showMask ? 'repeating-conic-gradient(#7b8791 0 25%, #cbd3da 0 50%) 50% / 28px 28px' : 'repeating-conic-gradient(#d7dce0 0 25%, #f3f5f6 0 50%) 50% / 28px 28px' - const subjectStyle = useMemo(() => ({ background: showMask ? '#596773' : 'linear-gradient(145deg,#1769d2 0 38%,#00a8c7 38% 66%,#bd7411 66%)', opacity: showMask ? .88 : 1, clipPath: `polygon(23% 11%, 73% 8%, 89% 30%, 79% 81%, 52% 93%, 17% 78%, 8% 39%)` }), [showMask]) - const reset = () => { setColor('#E8EEF2'); setSimilarity(72); setOuterOnly(true); setShowMask(false) } - return
- -
PNG PROCESSING / SINGLE TOOL

Remove background.

Select a background color and tune the edge detection. Changes are processed automatically in your browser.

LIVE PREVIEW
-
REMOVER SETTINGSConfigure detection
TOOL 02
-
setColor(e.target.value)} /> setColor(e.target.value)} aria-label="Choose background color" />
sampled from image background
-
setSimilarity(Number(e.target.value))} />
strict edgesmore removal
-

Only remove connected background pixels from the edges.

-

Preview the detected transparency mask.

-
updates automatically
-
-
SOURCE / RESULTcomparison.png
processed
SOURCEoriginal.png
OBJECT
1200 × 800
RESULT{showMask ? 'mask-preview.png' : 'removed-bg.png'}
{showMask ? 'MASK' : 'PNG'}
1200 × 800
FORMAT PNG-24ALPHA {showMask ? 'MASK' : 'ENABLED'}SIMILARITY {similarity}%
-
easy-png-tools v2.4.0background remover · local-only© 2024
-
-} diff --git a/refs/app/easy-png-tools/demo/page.tsx b/refs/app/easy-png-tools/demo/page.tsx deleted file mode 100644 index b157a24..0000000 --- a/refs/app/easy-png-tools/demo/page.tsx +++ /dev/null @@ -1 +0,0 @@ -export { default } from '../../page' diff --git a/refs/app/easy-png-tools/gradient/page.tsx b/refs/app/easy-png-tools/gradient/page.tsx deleted file mode 100644 index a0fbe1f..0000000 --- a/refs/app/easy-png-tools/gradient/page.tsx +++ /dev/null @@ -1,33 +0,0 @@ -'use client' - -import TopBar from '@/components/top-bar' -import { useMemo, useState } from 'react' -import { Check, ChevronDown, Copy, Download, RotateCcw } from 'lucide-react' - -const directions = ['0° →', '45° ↗', '90° ↑', '135° ↖', '180° ←', '225° ↙', '270° ↓', '315° ↘'] - -export default function GradientPage() { - const [start, setStart] = useState('#1769D2') - const [end, setEnd] = useState('#00A8C7') - const [direction, setDirection] = useState(135) - const [opacity, setOpacity] = useState(100) - const [type, setType] = useState<'linear' | 'radial'>('linear') - const [copied, setCopied] = useState(false) - const gradient = useMemo(() => type === 'linear' ? `linear-gradient(${direction}deg, ${start} 0%, ${end} 100%)` : `radial-gradient(circle, ${start} 0%, ${end} 100%)`, [direction, end, start, type]) - const css = `background: ${gradient};\nopacity: ${opacity / 100};` - const reset = () => { setStart('#1769D2'); setEnd('#00A8C7'); setDirection(135); setOpacity(100); setType('linear') } - const copyCss = async () => { await navigator.clipboard?.writeText(css); setCopied(true); setTimeout(() => setCopied(false), 1400) } - return
- -
PNG PROCESSING / SINGLE TOOL

Gradient background.

Create a clean, export-ready gradient with precise control over color, direction and transparency.

LIVE PREVIEW
-
GRADIENT SETTINGSConfigure output
TOOL 01
-
-
setStart(e.target.value)} />
setEnd(e.target.value)} />
-
setDirection(Number(e.target.value))} />
{directions.map((item, i) => )}
-
setOpacity(Number(e.target.value))} />
-
updates automatically
-
-
OUTPUT PREVIEWgradient.png
PNG
easy-png-tools
GENERATED CSS
{css}
-
easy-png-tools v2.4.0gradient tool · local-only© 2024
-
-} diff --git a/refs/app/easy-png-tools/list-tools/page.tsx b/refs/app/easy-png-tools/list-tools/page.tsx deleted file mode 100644 index 17d31d7..0000000 --- a/refs/app/easy-png-tools/list-tools/page.tsx +++ /dev/null @@ -1,28 +0,0 @@ -"use client" - -import TopBar from '@/components/top-bar' -import Link from "next/link" -import { useMemo, useState } from "react" -import { ArrowUpRight, FileImage, Filter, Search, Sparkles } from "lucide-react" - -const groups = [ - { name: "CONVERT", tools: [["Convert JPG to PNG", "Re-encode JPEG files as lossless PNG while preserving transparency.", "/easy-png-tools/gradient"], ["Convert WebP to PNG", "Turn WebP images into a universal PNG format for any workflow."], ["PNG to Base64", "Encode an image as a base64 string for embedding in code or styles."], ["PNG to Data URI", "Build a complete data URI ready for HTML and CSS."], ["Convert PNG to JPG", "Composite transparency over a selected backdrop and export JPEG."]] }, - { name: "TRANSPARENCY", tools: [["Remove background PNG", "Remove a solid background by color, tolerance, or edge-connected regions.", "/easy-png-tools/background-remover"], ["Extract alpha mask", "Turn the alpha channel into a clean black-and-white mask."], ["Round corners PNG", "Clip the image corners by a precise radius percentage."], ["Outline PNG", "Add a colored ring around opaque content with adjustable thickness."], ["Change PNG opacity", "Multiply the alpha channel while keeping the original colors unchanged."]] }, - { name: "COLOR", tools: [["Create gradient PNG", "Generate a smooth transition between two colors with direction controls.", "/easy-png-tools/gradient"], ["Grayscale PNG", "Convert the image to luminance-based shades of gray."], ["Invert colors PNG", "Invert every color channel while leaving alpha untouched."], ["Brightness & contrast", "Adjust brightness and contrast across a controlled range."], ["Temperature PNG", "Make an image warmer or cooler with a single precise control."]] }, - { name: "GEOMETRY", tools: [["Resize PNG", "Scale an image with bilinear interpolation and optional aspect lock."], ["Crop PNG", "Cut a rectangular area with exact coordinates and dimensions."], ["Rotate PNG", "Rotate by 90, 180, or 270 degrees without quality loss."], ["Flip PNG", "Mirror the image horizontally or vertically."], ["Add padding to PNG", "Expand the canvas on all sides by a chosen number of pixels."]] }, - { name: "FILTERS", tools: [["Blur PNG", "Apply a fast Gaussian-style blur with transparent edge handling."], ["Sharpen PNG", "Emphasize edges with an adjustable sharpening kernel."], ["Vignette PNG", "Smoothly darken the image edges while preserving the center."], ["JPEG artifacts", "Simulate low-quality JPEG recompression for testing."]] }, - { name: "ANALYZE", tools: [["PNG info", "Inspect dimensions, alpha presence, and unique color count."], ["Check grayscale", "Report whether the image contains only shades of gray."], ["Check transparency", "Detect transparent and semi-transparent pixels."], ["PNG orientation", "Classify the image as portrait, landscape, or square."]] }, -] - -export default function ListToolsPage() { - const [query, setQuery] = useState("") - const [active, setActive] = useState("ALL") - const filtered = useMemo(() => groups.map(group => ({ ...group, tools: group.tools.filter(([name, description]) => (active === "ALL" || active === group.name) && `${name} ${description}`.toLowerCase().includes(query.toLowerCase())) })).filter(group => group.tools.length), [query, active]) - return
-
EASY-PNG-TOOLS / CATALOG

Tool catalog

Focused utilities for working with PNG. Inspect, transform, and export — locally in your browser.

32TOOLS
AVAILABLE
-
{["ALL", ...groups.map(g => g.name)].map(name => )}
-
{filtered.map(group =>
{group.name}{String(group.tools.length).padStart(2, "0")} TOOLS
{group.tools.map(([name, description, href], index) => { if (!href) e.preventDefault() }}>{name}{description}{String(index + 1).padStart(2, "0")})}
)}
- {!filtered.length &&
No tools match your search.
} -
ALL OPERATIONS RUN LOCALLY YOUR FILES NEVER LEAVE THIS DEVICE
-
-} diff --git a/refs/app/globals.css b/refs/app/globals.css deleted file mode 100644 index 2b1aac9..0000000 --- a/refs/app/globals.css +++ /dev/null @@ -1,15 +0,0 @@ -@import 'tailwindcss'; -@import 'tw-animate-css'; -@import 'shadcn/tailwind.css'; -@theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --color-border: var(--line); --font-sans: 'IBM Plex Sans', sans-serif; --font-mono: 'IBM Plex Mono', monospace; } -:root { color-scheme: light; --background:#eef1f4; --foreground:#17212b; --panel:#f8fafb; --line:#cbd3da; --muted:#6d7883; --blue:#1769d2; --cyan:#00a8c7; --amber:#bd7411; --radius:4px; } -* { box-sizing:border-box; border-color:var(--line); } html { background:var(--background); } body { margin:0; background:var(--background); color:var(--foreground); font-family:var(--font-sans); } button,input { font:inherit; } button { cursor:pointer; } -.app-shell { min-height:100vh; background-color:var(--background); background-image:linear-gradient(#dce2e7 1px,transparent 1px),linear-gradient(90deg,#dce2e7 1px,transparent 1px); background-size:32px 32px; }.dark-mode { --background:#11171d; --foreground:#e8eef2; --panel:#182129; --line:#33414c; --muted:#91a0ac; --blue:#54a2ff; background-image:linear-gradient(rgba(30,42,52,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(30,42,52,.28) 1px,transparent 1px); } -.topbar,.brand,.top-actions,.language,.status,.title-row,.pipeline-head,.step-heading,.step-tools,.pipeline-footer,.preview-top,.footer { display:flex; align-items:center; }.topbar { height:64px; border-bottom:1px solid var(--line); background:var(--panel); justify-content:space-between; padding:0 clamp(20px,4vw,64px); }.topbar > .brand { color:var(--foreground); text-decoration:none; }.top-nav { display:flex; align-items:center; gap:22px; margin-left:auto; margin-right:28px; }.top-nav a { color:var(--muted); font:10px var(--font-mono); text-decoration:none; white-space:nowrap; }.top-nav a:hover,.top-nav a.active { color:var(--blue); }.brand { gap:10px; font:600 14px var(--font-mono); }.brand-mark { display:grid; place-items:center; width:30px; height:30px; background:var(--blue); color:white; font-size:11px; }.version,.label,.step-type,.eyebrow { font:10px var(--font-mono); letter-spacing:.12em; color:var(--muted); }.version,.eyebrow { color:var(--blue); }.top-actions { gap:16px; }.status { gap:7px; color:var(--muted); font:10px var(--font-mono); letter-spacing:.08em; }.status i,.auto-note i { width:6px; height:6px; background:#25a96a; border-radius:50%; }.icon-btn { display:grid; place-items:center; border:0; background:transparent; color:var(--muted); padding:6px; }.language { border:1px solid var(--line); }.language button { border:0; background:transparent; padding:6px 9px; color:var(--muted); font:10px var(--font-mono); }.language .active { background:var(--foreground); color:var(--background); } -.page-grid { width:100%; max-width:none; margin:auto; padding:60px clamp(24px,4vw,72px) 72px; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(520px,.95fr); gap:56px; align-items:start; }.preview-panel { position:sticky; top:24px; margin-top:0; min-width:0; }.preview-top { justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:14px; }.preview-actions { display:flex; align-items:center; gap:18px; }.preview-meta { display:flex; gap:24px; }.preview-meta div { display:grid; gap:5px; }.preview-meta span { font:10px var(--font-mono); color:var(--muted); }.preview-meta b { font:600 11px var(--font-mono); }.workspace,.preview-panel { min-width:0; }.preview-stack { display:grid; width:100%; min-width:0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.preview-tile { width:100%; min-width:0; overflow:hidden; }.history-toggle { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:18px; padding:11px 14px; border:1px solid var(--line); background:transparent; color:var(--muted); font:10px var(--font-mono); letter-spacing:.04em; }.history-toggle:hover { color:var(--foreground); background:var(--panel); }.top-toggle { width:auto; margin:0; padding:8px 10px; }.history-toggle .rotated { transform:rotate(180deg); }.tile-canvas { width:100%; min-width:0; min-height:clamp(300px,22vw,430px); overflow:hidden; }.image-preview { max-width:100%; min-width:0; overflow:hidden; }.eyebrow { margin-bottom:18px; }.eyebrow span { color:var(--muted); margin:0 7px; }.title-row { justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:56px; }h1 { font-size:clamp(36px,4vw,64px); line-height:1; letter-spacing:-.06em; margin:0 0 16px; max-width:700px; font-weight:650; }.lede { color:var(--muted); margin:0; max-width:550px; line-height:1.6; }.file-chip { white-space:nowrap; display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--panel); padding:10px 12px; font:11px var(--font-mono); color:var(--muted); }.file-chip b { color:var(--blue); font-weight:500; }.pipeline-head { justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:12px; }.pipeline-head strong,.preview-top strong { display:block; font:600 14px var(--font-mono); margin-top:5px; }.pipeline-head em { color:#25a96a; font-style:normal; font-size:10px; }.add-btn,.reset-btn { border:0; background:transparent; color:var(--blue); display:flex; align-items:center; gap:7px; font-size:12px; }.steps-list { padding-top:14px; display:grid; gap:10px; }.step-card { display:grid; grid-template-columns:46px 20px 1fr; min-height:138px; border:1px solid var(--line); background:var(--panel); }.step-index { font:11px var(--font-mono); color:var(--blue); padding:17px 0 0 15px; }.drag { color:var(--line); margin-top:17px; }.step-body { padding:15px 18px 18px; }.step-heading { justify-content:space-between; gap:15px; }.step-heading h2 { font:600 15px var(--font-mono); margin:5px 0 18px; }.step-tools { gap:13px; }.step-tools button { border:0; background:none; color:var(--muted); }.check { color:#238354; font:10px var(--font-mono); display:flex; align-items:center; gap:4px; }.controls { display:grid; grid-template-columns:1.1fr 1fr 1.2fr; gap:16px; }.controls.compact { grid-template-columns:1fr 1fr; }.control-block label { display:flex; justify-content:space-between; margin-bottom:8px; color:var(--muted); font:10px var(--font-mono); letter-spacing:.08em; }.control-block output { color:var(--foreground); }.color-field { display:flex; align-items:center; gap:8px; border:1px solid var(--line); height:32px; padding:0 8px; }.swatch { width:14px; height:14px; border:1px solid var(--line); }.swatch.dark { background:#16202b; }.color-field input { min-width:0; flex:1; border:0; outline:0; color:var(--foreground); background:transparent; font:11px var(--font-mono); }.control-block input[type=range] { width:100%; accent-color:var(--blue); }.segmented { display:flex; border:1px solid var(--line); height:32px; }.segmented button { flex:1; border:0; border-right:1px solid var(--line); background:transparent; color:var(--muted); font:10px var(--font-mono); }.segmented .selected { background:var(--blue); color:white; }.transform-note,.auto-note { display:flex; align-items:center; gap:8px; color:var(--muted); font:11px var(--font-mono); }.pipeline-footer { justify-content:space-between; padding-top:18px; }.auto-note { color:var(--muted); }.auto-note i { display:inline-block; }.preview-panel { position:sticky; top:24px; align-self:start; border:1px solid var(--line); background:var(--panel); padding:18px; }.preview-top { justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:15px; }.preview-stack { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:16px 0; }.preview-tile { border:1px solid var(--line); background:var(--background); }.preview-tile.active { border-color:var(--blue); }.tile-canvas { aspect-ratio:1.35; display:grid; place-items:center; padding:16px; background-color:#e4e8eb; background-image:linear-gradient(45deg,#d2d8dc 25%,transparent 25%),linear-gradient(-45deg,#d2d8dc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d2d8dc 75%),linear-gradient(-45deg,transparent 75%,#d2d8dc 75%); background-size:14px 14px; background-position:0 0,0 7px,7px -7px,-7px 0; }.image-preview { width:80%; aspect-ratio:1.5; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:#16202b; font:600 10px var(--font-mono); }.sample-icon { border:1px solid currentColor; padding:3px 5px; font-size:9px; }.tile-label { display:flex; justify-content:space-between; gap:8px; padding:8px; border-top:1px solid var(--line); font:9px var(--font-mono); color:var(--blue); }.tile-label b { color:var(--muted); font-weight:400; text-align:right; }.preview-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; border-top:1px solid var(--line); padding-top:14px; }.preview-meta span { display:block; color:var(--muted); font:9px var(--font-mono); }.preview-meta b { display:block; margin-top:5px; font:11px var(--font-mono); }.download-btn { width:100%; margin-top:18px; height:42px; display:flex; justify-content:center; align-items:center; gap:9px; border:0; background:var(--blue); color:white; font:11px var(--font-mono); }.preview-note { color:var(--muted); font-size:11px; line-height:1.5; margin:12px 0 0; }.footer { justify-content:space-between; border-top:1px solid var(--line); padding:16px clamp(20px,4vw,72px); color:var(--muted); font:10px var(--font-mono); }.footer span { display:flex; gap:7px; align-items:center; }.footer b { color:var(--blue); font-weight:400; } -@media (max-width:1200px) { .page-grid { grid-template-columns:minmax(0,1fr) minmax(420px,.9fr); gap:32px; } }.dark-mode .app-shell { background-image:linear-gradient(rgba(30,42,52,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(30,42,52,.28) 1px,transparent 1px); }.dark-mode .tile-canvas { background-color:#202a31; background-image:linear-gradient(45deg,#29343c 25%,transparent 25%),linear-gradient(-45deg,#29343c 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#29343c 75%),linear-gradient(-45deg,transparent 75%,#29343c 75%); }.dark-mode .image-preview { color:#16202b; } -@media (max-width:800px) { .topbar { height:auto; min-height:64px; padding:12px 16px; flex-wrap:wrap; gap:12px; }.top-nav { order:3; width:100%; margin:0; gap:12px; overflow:auto; padding-bottom:2px; }.top-nav a { font-size:9px; }.status { display:none; }.page-grid { display:block; padding:36px 16px 48px; }.title-row { display:block; margin-bottom:40px; }.file-chip { margin-top:22px; width:max-content; }.controls,.controls.compact { grid-template-columns:1fr; }.preview-panel { position:static; margin-top:36px; }.footer { padding:0 16px 20px; gap:12px; flex-wrap:wrap; }.footer span:last-child { display:none; } } -@media (max-width:1100px) { .preview-stack { grid-template-columns:repeat(3,minmax(220px,1fr)); } }.preview-actions { flex-wrap:wrap; justify-content:flex-end; }.download-btn { white-space:nowrap; } @media (max-width:800px) { .preview-top { align-items:flex-start; flex-direction:column; gap:18px; }.preview-actions { width:100%; justify-content:space-between; }.preview-meta { gap:14px; }.preview-stack { grid-template-columns:repeat(2,minmax(0,1fr)); }.tile-canvas { min-height:260px; } } @media (max-width:480px) { .preview-stack { grid-template-columns:1fr; }.preview-meta { width:100%; justify-content:space-between; }.title-row h1 { font-size:40px; }.pipeline-footer { align-items:flex-start; flex-direction:column; gap:12px; } } -.tool-page { width:100%; padding:60px clamp(24px,4vw,72px) 72px; }.tool-title { display:flex; justify-content:space-between; align-items:end; gap:32px; margin-bottom:48px; }.tool-title h1 { margin-bottom:14px; }.tool-status { display:flex; align-items:center; gap:8px; color:#25a96a; font:10px var(--font-mono); white-space:nowrap; }.tool-status i,.auto-note i { width:6px; height:6px; background:#25a96a; border-radius:50%; }.gradient-layout { display:grid; grid-template-columns:minmax(360px,.7fr) minmax(0,1.3fr); gap:56px; align-items:start; }.settings-panel,.gradient-preview { background:var(--panel); border:1px solid var(--line); }.panel-heading,.preview-toolbar { display:flex; justify-content:space-between; align-items:center; padding:18px 20px; border-bottom:1px solid var(--line); }.panel-heading strong,.preview-toolbar strong { display:block; margin-top:5px; font:600 14px var(--font-mono); }.setting-group { padding:22px 20px; border-bottom:1px solid var(--line); }.setting-group label { display:flex; justify-content:space-between; margin-bottom:12px; font:10px var(--font-mono); letter-spacing:.1em; color:var(--muted); }.setting-group output { color:var(--blue); }.color-row { display:flex; align-items:center; gap:10px; }.color-row .color-field { flex:1; }.stop-arrow { color:var(--muted); }.gradient-bar { height:14px; margin-top:14px; border:1px solid var(--line); }.direction-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:14px; }.direction-grid button,.secondary-btn { border:1px solid var(--line); background:transparent; color:var(--muted); padding:8px 6px; font:10px var(--font-mono); }.direction-grid button.selected,.secondary-btn:hover { background:var(--foreground); color:var(--background); }.wide { width:100%; }.settings-footer { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; }.large-canvas { padding:24px; background-color:#202a31; background-image:linear-gradient(45deg,#29343c 25%,transparent 25%),linear-gradient(-45deg,#29343c 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#29343c 75%),linear-gradient(-45deg,transparent 75%,#29343c 75%); background-size:28px 28px; background-position:0 0,0 14px,14px -14px,-14px 0; }.gradient-art { min-height:clamp(420px,42vw,680px); display:grid; place-content:center; justify-items:center; color:#fff; font:12px var(--font-mono); }.art-mark { display:grid; place-items:center; width:70px; height:70px; margin-bottom:12px; border:1px solid rgba(255,255,255,.65); font-size:16px; }.code-block { padding:16px 20px; }.code-block > div { display:flex; justify-content:space-between; align-items:center; }.code-block pre { margin:12px 0 0; padding:14px; background:var(--background); color:var(--blue); font:12px/1.6 var(--font-mono); white-space:pre-wrap; }.preview-actions { display:flex; align-items:center; gap:10px; }.secondary-btn { display:flex; align-items:center; gap:8px; }.dark-mode .large-canvas { background-color:#202a31; } -.remover-layout { display:grid; grid-template-columns:minmax(360px,.62fr) minmax(0,1.38fr); gap:56px; align-items:start; }.remover-preview { min-width:0; background:var(--panel); border:1px solid var(--line); }.comparison-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding:20px; }.image-card { min-width:0; }.image-label { display:flex; justify-content:space-between; margin-bottom:10px; font:10px var(--font-mono); color:var(--muted); }.image-label span { color:var(--blue); }.image-label b { font-weight:400; }.remover-canvas { position:relative; min-height:clamp(360px,30vw,560px); overflow:hidden; display:grid; place-items:center; border:1px solid var(--line); }.source-canvas { background:#e8eef2; }.subject { width:74%; height:68%; display:grid; place-items:center; color:rgba(255,255,255,.85); font:600 14px var(--font-mono); text-shadow:0 1px 2px #17212b; transition:all .2s ease; }.subject-source { transform:rotate(-3deg); }.canvas-size { position:absolute; right:10px; bottom:9px; font:9px var(--font-mono); color:var(--muted); }.result-meta { display:flex; gap:24px; padding:16px 20px; border-top:1px solid var(--line); font:10px var(--font-mono); color:var(--muted); }.result-meta b { color:var(--foreground); font-weight:600; margin-left:6px; }.processed { display:flex; align-items:center; gap:5px; color:#25a96a; font:10px var(--font-mono); }.color-reference,.range-hints { display:flex; justify-content:space-between; margin-top:10px; color:var(--muted); font:10px var(--font-mono); }.color-reference { justify-content:flex-start; gap:8px; }.color-reference span { width:9px; height:9px; border:1px solid var(--line); }.native-color { width:30px; padding:0!important; border:0!important; }.toggle-group label { align-items:center; cursor:pointer; }.toggle-group input { display:none; }.toggle { width:32px; height:18px; border:1px solid var(--line); position:relative; }.toggle:after { content:''; position:absolute; width:10px; height:10px; background:var(--muted); top:3px; left:3px; transition:transform .2s; }.toggle-group input:checked + .toggle { background:var(--blue); border-color:var(--blue); }.toggle-group input:checked + .toggle:after { background:white; transform:translateX(14px); }.toggle-group p { margin:8px 0 0; color:var(--muted); font-size:12px; line-height:1.5; }.catalog-nav { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:-64px 0 64px; padding:18px 0; border-bottom:1px solid var(--line); }.catalog-brand { color:var(--foreground); font:600 14px var(--font-mono); text-decoration:none; }.catalog-nav nav { display:flex; gap:24px; }.catalog-nav nav a,.catalog-nav-status { color:var(--muted); font:10px var(--font-mono); text-decoration:none; }.catalog-nav nav a:hover,.catalog-nav nav a.current { color:var(--blue); }.catalog-nav-status { color:#25a96a; }.catalog-page { width:100%; max-width:none; margin:0; padding:60px clamp(24px,4vw,72px) 72px; }.catalog-head { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; padding-bottom:42px; border-bottom:1px solid var(--line); }.catalog-head h1 { margin:12px 0 14px; }.catalog-head p { max-width:660px; margin:0; color:var(--muted); font:14px/1.6 var(--font-mono); }.catalog-total { display:flex; align-items:center; gap:14px; color:var(--muted); font:10px/1.4 var(--font-mono); text-align:right; }.catalog-total b { color:var(--blue); font:400 clamp(48px,5vw,76px)/.9 var(--font-mono); letter-spacing:-.08em; }.catalog-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 0 42px; }.catalog-search { display:flex; align-items:center; gap:12px; width:min(420px,100%); padding:12px 14px; border:1px solid var(--line); color:var(--muted); }.catalog-search input { width:100%; border:0; outline:0; background:transparent; color:var(--foreground); font:12px var(--font-mono); }.catalog-filters { display:flex; align-items:center; gap:6px; flex-wrap:wrap; color:var(--muted); }.catalog-filters button { padding:8px 10px; border:1px solid transparent; background:transparent; color:var(--muted); font:10px var(--font-mono); }.catalog-filters button:hover,.catalog-filters button.active { border-color:var(--blue); color:var(--blue); }.catalog-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:56px 28px; }.catalog-group { min-width:0; }.group-title { display:flex; justify-content:space-between; align-items:center; padding-bottom:12px; border-bottom:1px solid var(--line); color:var(--foreground); font:600 11px var(--font-mono); letter-spacing:.12em; }.group-title i { color:var(--muted); font:10px var(--font-mono); font-style:normal; }.tool-cards { display:grid; gap:10px; padding-top:14px; }.tool-card { display:grid; grid-template-columns:42px minmax(0,1fr) 24px 18px; align-items:center; gap:14px; min-height:106px; padding:16px; border:1px solid var(--line); background:var(--panel); color:var(--foreground); text-decoration:none; transition:border-color .18s,transform .18s,background .18s; }.tool-card:hover { border-color:var(--blue); background:var(--panel-strong); transform:translateY(-2px); }.tool-icon { display:grid; place-items:center; width:42px; height:42px; background:color-mix(in srgb,var(--blue) 12%,transparent); color:var(--blue); }.tool-copy { min-width:0; display:grid; gap:8px; }.tool-copy strong { font:600 13px var(--font-mono); }.tool-copy span { color:var(--muted); font:12px/1.5 var(--font-mono); }.tool-index { color:var(--muted); font:10px var(--font-mono); align-self:start; }.tool-arrow { color:var(--blue); opacity:0; transition:opacity .18s,transform .18s; }.tool-card:hover .tool-arrow { opacity:1; transform:translate(2px,-2px); }.catalog-empty { display:flex; gap:10px; align-items:center; padding:40px; border:1px dashed var(--line); color:var(--muted); font:12px var(--font-mono); }.catalog-footer { margin-top:64px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font:10px var(--font-mono); }.catalog-footer span { margin:0 8px; color:var(--blue); } @media (max-width:800px) { .catalog-nav { margin:-36px 0 36px; }.catalog-nav-status { display:none; }.catalog-nav nav { gap:14px; }.catalog-page { padding:36px 16px 48px; }.catalog-head { align-items:flex-start; flex-direction:column; gap:24px; }.catalog-total { text-align:left; }.catalog-toolbar { align-items:stretch; flex-direction:column; padding-bottom:30px; }.catalog-search { width:100%; }.catalog-groups { grid-template-columns:1fr; gap:36px; }.tool-card { min-height:96px; grid-template-columns:38px minmax(0,1fr) 18px; gap:12px; }.tool-icon { width:38px; height:38px; }.tool-index { display:none; }.tool-arrow { opacity:1; } } -@media (max-width:800px) { .tool-page { padding:36px 16px 48px; }.tool-title { display:block; }.tool-status { margin-top:22px; }.gradient-layout,.remover-layout { grid-template-columns:1fr; gap:24px; }.gradient-preview,.remover-preview { order:-1; }.gradient-art { min-height:340px; }.preview-toolbar { align-items:flex-start; flex-direction:column; gap:16px; }.preview-actions { width:100%; justify-content:flex-end; }.comparison-grid { grid-template-columns:1fr; } .remover-canvas { min-height:300px; } .result-meta { flex-wrap:wrap; gap:12px 18px; } } diff --git a/refs/app/layout.tsx b/refs/app/layout.tsx deleted file mode 100644 index a7c1a61..0000000 --- a/refs/app/layout.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { Analytics } from '@vercel/analytics/next' -import type { Metadata, Viewport } from 'next' -import './globals.css' - -export const metadata: Metadata = { - title: 'easy-png-tools / Demo', - description: 'Technical workspace for building PNG processing pipelines.', - generator: 'easy-png-tools', -} - -export const viewport: Viewport = { - colorScheme: 'light', - themeColor: '#eef1f4', -} - -export default function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) { - return {children}{process.env.NODE_ENV === 'production' && } -} diff --git a/refs/app/page.tsx b/refs/app/page.tsx deleted file mode 100644 index d509d22..0000000 --- a/refs/app/page.tsx +++ /dev/null @@ -1,40 +0,0 @@ -'use client' - -import TopBar from '@/components/top-bar' -import { useMemo, useState } from 'react' -import { ArrowDownToLine, Check, ChevronDown, Download, GripVertical, Link2, MoreHorizontal, Plus, RotateCcw, Settings2, SlidersHorizontal, Upload, X } from 'lucide-react' - -const initialSteps = [ - { id: 1, title: 'Gradient background', type: 'BACKGROUND' }, - { id: 2, title: 'Remove background', type: 'TRANSFORM' }, - { id: 3, title: 'Add outline', type: 'STYLE' }, - { id: 4, title: 'Round corners', type: 'STYLE' }, -] - -function PreviewTile({ label, sublabel, style, active = false }: { label: string; sublabel: string; style: React.CSSProperties; active?: boolean }) { - return
PNGeasy-png-tools
{label}{sublabel}
-} - -export default function Page() { - const [steps, setSteps] = useState(initialSteps) - const [angle, setAngle] = useState(135) - const [radius, setRadius] = useState(18) - const [outline, setOutline] = useState(2) - const [language, setLanguage] = useState('RU') - const [showIntermediate, setShowIntermediate] = useState(true) - const [gradient, setGradient] = useState('#DCEBFF') - const gradientStyle = useMemo(() => ({ background: `linear-gradient(${angle}deg, ${gradient}, #8BC8F5)` }), [angle, gradient]) - const finalStyle = { ...gradientStyle, borderRadius: radius, boxShadow: `0 0 0 ${outline}px #16202B` } - - return
- -
-
PNG PROCESSING / WORKSPACE

Build your image pipeline.

Chain simple tools together. Every change is processed automatically and previewed at each stage.

source.png1.8 MB
-
PROCESSING PIPELINE{steps.length} active steps • LIVE
-
{steps.map((step, index) =>
{String(index + 1).padStart(2, '0')}
{step.type}

{step.title}

AUTO
{index === 0 ?
setGradient(e.target.value)} aria-label="Gradient color" />
setAngle(Number(e.target.value))} />
: index === 2 ?
setOutline(Number(e.target.value))} />
: index === 3 ?
setRadius(Number(e.target.value))} />
Preserve aspect ratio
:
Automatic subject detection enabled
}
)}
-
changes are applied automatically
-
-
PIPELINE OUTPUTSVisual history
DIMENSIONS1200 × 800 px
FORMATPNG-24
SIZE1.2 MB
{showIntermediate && <>}

Output is generated in-browser. Your files never leave this device.

-
easy-png-tools v2.4.0 pipeline is local-only© 2024
-
-} diff --git a/refs/components.json b/refs/components.json deleted file mode 100644 index 45921ec..0000000 --- a/refs/components.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "$schema": "https://ui.shadcn.com/schema.json", - "style": "base-nova", - "rsc": true, - "tsx": true, - "tailwind": { - "config": "", - "css": "app/globals.css", - "baseColor": "neutral", - "cssVariables": true, - "prefix": "" - }, - "aliases": { - "components": "@/components", - "utils": "@/lib/utils", - "ui": "@/components/ui", - "lib": "@/lib", - "hooks": "@/hooks" - }, - "iconLibrary": "lucide" -} diff --git a/refs/components/top-bar.tsx b/refs/components/top-bar.tsx deleted file mode 100644 index 0c1a619..0000000 --- a/refs/components/top-bar.tsx +++ /dev/null @@ -1,36 +0,0 @@ -"use client" - -import Link from "next/link" -import { CircleHelp, Moon, Sun } from "lucide-react" -import { usePathname } from "next/navigation" -import { useEffect, useState } from "react" - -const links = [ - ["Workspace", "/"], - ["Catalog", "/easy-png-tools/list-tools"], - ["Gradient", "/easy-png-tools/gradient"], - ["Background remover", "/easy-png-tools/background-remover"], -] as const - -export function TopBar({ section = "WORKSPACE", status = "LOCAL MODE / READY" }: { section?: string; status?: string }) { - const pathname = usePathname() - const [dark, setDark] = useState(false) - - useEffect(() => { - const stored = window.localStorage.getItem("ep-theme") - const isDark = stored === "dark" - setDark(isDark) - document.documentElement.classList.toggle("dark-mode", isDark) - }, []) - - const toggleTheme = () => { - const next = !dark - setDark(next) - document.documentElement.classList.toggle("dark-mode", next) - window.localStorage.setItem("ep-theme", next ? "dark" : "light") - } - - return
EPeasy-png-tools/ {section}
{status}
/
-} - -export default TopBar diff --git a/refs/components/ui/button.tsx b/refs/components/ui/button.tsx deleted file mode 100644 index b520e87..0000000 --- a/refs/components/ui/button.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import { Button as ButtonPrimitive } from '@base-ui/react/button' -import { cva, type VariantProps } from 'class-variance-authority' - -import { cn } from '@/lib/utils' - -const buttonVariants = cva( - "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", - { - variants: { - variant: { - default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80', - outline: - 'border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50', - secondary: - 'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground', - ghost: - 'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50', - destructive: - 'bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40', - link: 'text-primary underline-offset-4 hover:underline', - }, - size: { - default: - 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2', - xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3", - sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5", - lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2', - icon: 'size-8', - 'icon-xs': - "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3", - 'icon-sm': - 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg', - 'icon-lg': 'size-9', - }, - }, - defaultVariants: { - variant: 'default', - size: 'default', - }, - }, -) - -function Button({ - className, - variant = 'default', - size = 'default', - ...props -}: ButtonPrimitive.Props & VariantProps) { - return ( - - ) -} - -export { Button, buttonVariants } diff --git a/refs/lib/utils.ts b/refs/lib/utils.ts deleted file mode 100644 index fed2fe9..0000000 --- a/refs/lib/utils.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { clsx, type ClassValue } from 'clsx' -import { twMerge } from 'tailwind-merge' - -export function cn(...inputs: ClassValue[]) { - return twMerge(clsx(inputs)) -} diff --git a/refs/next-env.d.ts b/refs/next-env.d.ts deleted file mode 100644 index b691a5f..0000000 --- a/refs/next-env.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -/// -/// -import "./.next/types/routes.d.ts"; -import "./.next/types/root-params.d.ts"; - -// NOTE: This file should not be edited -// see https://nextjs.org/docs/app/api-reference/config/typescript for more information. diff --git a/refs/next.config.mjs b/refs/next.config.mjs deleted file mode 100644 index 4cd9948..0000000 --- a/refs/next.config.mjs +++ /dev/null @@ -1,11 +0,0 @@ -/** @type {import('next').NextConfig} */ -const nextConfig = { - typescript: { - ignoreBuildErrors: true, - }, - images: { - unoptimized: true, - }, -} - -export default nextConfig diff --git a/refs/package.json b/refs/package.json deleted file mode 100644 index b096553..0000000 --- a/refs/package.json +++ /dev/null @@ -1,37 +0,0 @@ -{ - "name": "my-project", - "version": "0.1.0", - "private": true, - "scripts": { - "dev": "next dev", - "build": "next build", - "start": "next start" - }, - "dependencies": { - "@base-ui/react": "^1.5.0", - "@vercel/analytics": "1.6.1", - "class-variance-authority": "^0.7.1", - "clsx": "^2.1.1", - "lucide-react": "^1.16.0", - "next": "16.3.0", - "react": "^19", - "react-dom": "^19", - "shadcn": "^4.8.0", - "tailwind-merge": "^3.3.1", - "tw-animate-css": "^1.4.0" - }, - "devDependencies": { - "@tailwindcss/postcss": "^4.3.3", - "@types/node": "^24", - "@types/react": "^19", - "@types/react-dom": "^19", - "postcss": "^8.5", - "tailwindcss": "^4.3.3", - "typescript": "5.7.3" - }, - "pnpm": { - "overrides": { - "hono": "4.12.25" - } - } -} diff --git a/refs/pnpm-lock.yaml b/refs/pnpm-lock.yaml deleted file mode 100644 index 2b634a8..0000000 --- a/refs/pnpm-lock.yaml +++ /dev/null @@ -1,3928 +0,0 @@ -lockfileVersion: '9.0' - -settings: - autoInstallPeers: true - excludeLinksFromLockfile: false - -importers: - - .: - dependencies: - '@base-ui/react': - specifier: ^1.5.0 - version: 1.5.0(@date-fns/tz@1.4.1)(@types/react@19.2.14)(date-fns@4.1.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - '@vercel/analytics': - specifier: 1.6.1 - version: 1.6.1(next@16.3.0(@babel/core@7.29.7)(@types/node@24.10.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4))(react@19.2.4) - class-variance-authority: - specifier: ^0.7.1 - version: 0.7.1 - clsx: - specifier: ^2.1.1 - version: 2.1.1 - lucide-react: - specifier: ^1.16.0 - version: 1.17.0(react@19.2.4) - next: - specifier: 16.3.0 - version: 16.3.0(@babel/core@7.29.7)(@types/node@24.10.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - react: - specifier: ^19 - version: 19.2.4 - react-dom: - specifier: ^19 - version: 19.2.4(react@19.2.4) - shadcn: - specifier: ^4.8.0 - version: 4.10.0(@types/node@24.10.4)(typescript@5.7.3) - tailwind-merge: - specifier: ^3.3.1 - version: 3.4.0 - tw-animate-css: - specifier: ^1.4.0 - version: 1.4.0 - devDependencies: - '@tailwindcss/postcss': - specifier: ^4.3.3 - version: 4.3.3 - '@types/node': - specifier: ^24 - version: 24.10.4 - '@types/react': - specifier: ^19 - version: 19.2.14 - '@types/react-dom': - specifier: ^19 - version: 19.2.3(@types/react@19.2.14) - postcss: - specifier: ^8.5 - version: 8.5.6 - tailwindcss: - specifier: ^4.3.3 - version: 4.3.3 - typescript: - specifier: 5.7.3 - version: 5.7.3 - -packages: - - '@alloc/quick-lru@5.2.0': - resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==} - engines: {node: '>=10'} - - '@babel/code-frame@7.29.7': - resolution: {integrity: sha512-Aup7aUOfpbAUg2ROOJN6Iw5f9DMBlzu0mIkm/malLQFN/YQgO48wCj0Kxa3sEHJvPVFg7siR+qRInwXd2qhQKw==} - engines: {node: '>=6.9.0'} - - '@babel/compat-data@7.29.7': - resolution: {integrity: sha512-locTkQyKvwIEgBzVrn8693ebc97F2U8ZHjbXwDXJ5Fn2TCpNwTlKcaKLkdHop5c/icOFE7qt7Q9JC5hnKNa6Gg==} - engines: {node: '>=6.9.0'} - - '@babel/core@7.29.7': - resolution: {integrity: sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==} - engines: {node: '>=6.9.0'} - - '@babel/generator@7.29.7': - resolution: {integrity: sha512-DkXD5OJQaAQIdZ1bt3UZdEnHAn9Imd3IVBdX03UFe+ony9Ojw5pzr9YVKGDY1jt+Gcn/FnGkNf8r+Vj5NOJWtQ==} - engines: {node: '>=6.9.0'} - - '@babel/helper-annotate-as-pure@7.29.7': - resolution: {integrity: sha512-OoK6239jHPuSQOoS0kfTVKn0b/rVTk0seKq4Gd2UMLtmOVLjDC0ki3e+c90Trqv2gMfvJFqkiljrr568+qddiw==} - engines: {node: '>=6.9.0'} - - '@babel/helper-compilation-targets@7.29.7': - resolution: {integrity: sha512-wem6WaBj4NaVYVdNhLPPVacES6ZJ+KBBfSkTMD3YZxbP3rm3Di85tJU5ljaUNhaOynt+Aj0xruhYuzQBt8n71g==} - engines: {node: '>=6.9.0'} - - '@babel/helper-create-class-features-plugin@7.29.7': - resolution: {integrity: sha512-IY3ZD9Tmooqr3TUhc3DUWxiuo8xx1DWLhd5M7hQ+ZWJamqM2BbalrBJb2MisSLoYorOj75U03qULCxQTY9r3hg==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0 - - '@babel/helper-globals@7.29.7': - resolution: {integrity: sha512-3nQVUAtvkKH9zahfWgw96Jc/uFOmjACE1kQz82E2lqWmHBgjzbNlsC22nuQTfahmWeQtTq5nQ/4Nnd2A1wj4zA==} - engines: {node: '>=6.9.0'} - - '@babel/helper-member-expression-to-functions@7.29.7': - resolution: {integrity: sha512-j+7JYmk1JYDtACIGj0QJqqWZjoUpMoEikQGADMaHgCMCSDqd2+P32rfcibUNrGOMWrlzK1WJBdxrB3JJQZwWtg==} - engines: {node: '>=6.9.0'} - - '@babel/helper-module-imports@7.29.7': - resolution: {integrity: sha512-ejHwrQQYcm9xnTivShn2IDOlIzInN34AXskvq9QicvCtEzq1Vzclu/tKF8Jq1Cg8JG2GL6/EmjgsCT7lXepE3g==} - engines: {node: '>=6.9.0'} - - '@babel/helper-module-transforms@7.29.7': - resolution: {integrity: sha512-UPUVSyXbOh627KiCIGQSgwWzGeBKLkaJ9PJEdrngIwMSzxLR4jS4+f1f1jb7VzBbg8nFLaYotvVPFCTqdrmTAg==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0 - - '@babel/helper-optimise-call-expression@7.29.7': - resolution: {integrity: sha512-+kmGVjcT9RGYzoDwdwEqEvGgKe3BYq+O1iGzjFubaNgZHwYHP6lsF2Yghf4kEuv9BV7tYDZ913aBW9am6YKong==} - engines: {node: '>=6.9.0'} - - '@babel/helper-plugin-utils@7.29.7': - resolution: {integrity: sha512-G7sHYigPY17oO5SYWnfD/0MTBwVR781S/JI643e/JhUYgVgWE/61SoW3NH9KWUKyKq5LVh3npif99Wkt6j86Jw==} - engines: {node: '>=6.9.0'} - - '@babel/helper-replace-supers@7.29.7': - resolution: {integrity: sha512-atfGXWSeCiF4DnKZIfmJfQRkSw9b9gNNXR1kqKjbhG4pGYCOnkp8OcTB8E3NXjBu8NpheSnOeNKz8KT7UNFTmQ==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0 - - '@babel/helper-skip-transparent-expression-wrappers@7.29.7': - resolution: {integrity: sha512-brcMGQaVzIeUb+6/bs1Av0f8YuNNjKY2JyvfRCsFuFsdKccEQ5Ges2y74D74NZ1Rz8lKJ9ksJkfqwQFJ/iNEyQ==} - engines: {node: '>=6.9.0'} - - '@babel/helper-string-parser@7.29.7': - resolution: {integrity: sha512-Pb5ijPrZ89GDH8223L4UP8i6QApWxs04RbPQJTeWDV0/keR2E36MeKnyr6LYmUUvqRRI+Iv87SuF1W6ErINzYw==} - engines: {node: '>=6.9.0'} - - '@babel/helper-validator-identifier@7.29.7': - resolution: {integrity: sha512-qehxGkRj55h/ff8EMaJ+cYhyaKlHIxqYDn682wQD7RNp9UujOQsHog2uS0r2vzr4pW+sXf90NeeayjcNaX3fFg==} - engines: {node: '>=6.9.0'} - - '@babel/helper-validator-option@7.29.7': - resolution: {integrity: sha512-N9ZErrD+yW5geCDtBqnOoxmR8+tNKiGuxKlDpuJxfsqpa2dFcexaziGAE/qoHLiDDreVNMupxGmSoNlyvsA3gw==} - engines: {node: '>=6.9.0'} - - '@babel/helpers@7.29.7': - resolution: {integrity: sha512-1k2lAGRMfHTcwuNYcCNUmaUffmQv8KWMfh2iJUUeRlwlwH4FdNG7mfPI10NPfLHJFThE4Tyr4mv7kTNZOiPuBg==} - engines: {node: '>=6.9.0'} - - '@babel/parser@7.29.7': - resolution: {integrity: sha512-hnORnjP/1P/zFEndoeX+n+t1RwWRJiJpM/jO7FW32Kn9r5+sJB2JWOdYo4L6k78j15eCwY3Gm/7364B1EMwtNg==} - engines: {node: '>=6.0.0'} - hasBin: true - - '@babel/plugin-syntax-jsx@7.29.7': - resolution: {integrity: sha512-TSu8+mHCoEaaCDEZ0I3+6mvTBYR4PCxQwf2z9/r5Tbztv6NaLR3B9thGTTxX2WGuGHJqRiAbKPeGTJ5XWXVg6A==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0-0 - - '@babel/plugin-syntax-typescript@7.29.7': - resolution: {integrity: sha512-ngr+82Sh0xMz25TPCZi+nC2iTzjfCdWS2ONXTp/PtSCHCgaCNBpdMqgvJ2ccdLlClVZ7sisIgB914j/JFe+RZA==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0-0 - - '@babel/plugin-transform-modules-commonjs@7.29.7': - resolution: {integrity: sha512-j0vCldybPC5b5dwCQOJ21uKtHzt7hxLygJTg9eF1ScfaikEDNfzn94XoW5Fi+seBR0nCyL23xaBFFkq7dTM8XQ==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0-0 - - '@babel/plugin-transform-typescript@7.29.7': - resolution: {integrity: sha512-jK52h8LaLc7JarhQV2ofeFMts4H7vnOXnqZNA6fYglBTZewRBE51KWt3BUltW1P+KoPsYkHoJeXePuz4zo2LMw==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0-0 - - '@babel/preset-typescript@7.29.7': - resolution: {integrity: sha512-/Foi8vKY2EVbed/1eZx0gJEEwHAIxogrySI7rULcRIvhZzbvoE/b5qG5Ghc0WKAFKOHA9SD1x7RsFlOYdutIiQ==} - engines: {node: '>=6.9.0'} - peerDependencies: - '@babel/core': ^7.0.0-0 - - '@babel/runtime@7.29.7': - resolution: {integrity: sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==} - engines: {node: '>=6.9.0'} - - '@babel/template@7.29.7': - resolution: {integrity: sha512-puq+Gf35oI24FeN11LkoUQFqv9uwNeWpxXZi/Ji3rRIoKAzKnxRaZ+Gkj0vKS9ZCiTESfng1N9LyOyXvo+m+Gg==} - engines: {node: '>=6.9.0'} - - '@babel/traverse@7.29.7': - resolution: {integrity: sha512-EhlfNQtZ+NK22w5BM61ciuiq1m58ed33Wr1Xan//ZRTy6hgjnwyCffRYwzsGXdASJSUJ1guZILsErh1eQcl+zw==} - engines: {node: '>=6.9.0'} - - '@babel/types@7.29.7': - resolution: {integrity: sha512-4zBIxpPzowiZpusoFkyGVwakdRJUyuH5PxQ/PrqghfdFWWasvnCdPfQXHrenDai+gyLARulZjZowCOj6fjT4pA==} - engines: {node: '>=6.9.0'} - - '@base-ui/react@1.5.0': - resolution: {integrity: sha512-z1gSAlced1yY+iM+mHDEtIkD8UI3Ebs52MuBPxvV6f5hRutk+xvCH/wuB7hDqDzK9JG5FoMz5nhrqtSs1wjt1A==} - engines: {node: '>=14.0.0'} - peerDependencies: - '@date-fns/tz': ^1.2.0 - '@types/react': ^17 || ^18 || ^19 - date-fns: ^4.0.0 - react: ^17 || ^18 || ^19 - react-dom: ^17 || ^18 || ^19 - peerDependenciesMeta: - '@date-fns/tz': - optional: true - '@types/react': - optional: true - date-fns: - optional: true - - '@base-ui/utils@0.2.9': - resolution: {integrity: sha512-x/PDDCYzoqPpjrdyb3VcyylTI2IjUXEtYDGi5foh7KsnmNJIIaVwA2GLgDH1dps1GgXiJbA60hM+AyuTfQzIvw==} - peerDependencies: - '@types/react': ^17 || ^18 || ^19 - react: ^17 || ^18 || ^19 - react-dom: ^17 || ^18 || ^19 - peerDependenciesMeta: - '@types/react': - optional: true - - '@date-fns/tz@1.4.1': - resolution: {integrity: sha512-P5LUNhtbj6YfI3iJjw5EL9eUAG6OitD0W3fWQcpQjDRc/QIsL0tRNuO1PcDvPccWL1fSTXXdE1ds+l95DV/OFA==} - - '@dotenvx/dotenvx@1.70.0': - resolution: {integrity: sha512-vC/rom87ym8HEyVdzZZS6/PYGg1Z5fmozUZ8l6cw1sYAxdL1lEyvE/JbK8cMFQoq3GsR/P1PiQRY+VXMtDN9bw==} - hasBin: true - - '@ecies/ciphers@0.2.6': - resolution: {integrity: sha512-patgsRPKGkhhoBjETV4XxD0En4ui5fbX0hzayqI3M8tvNMGUoUvmyYAIWwlxBc1KX5cturfqByYdj5bYGRpN9g==} - engines: {bun: '>=1', deno: '>=2.7.10', node: '>=16'} - peerDependencies: - '@noble/ciphers': ^1.0.0 - - '@emnapi/runtime@1.11.3': - resolution: {integrity: sha512-Xz4Tpyki7XyrpbUK1jR1AhdAdaXyhhY4lZ3neLodmhpuWfy2PAQN5B46sAiU4liOXGLkHypn/qU+jvfWSCYYLA==} - - '@floating-ui/core@1.7.5': - resolution: {integrity: sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==} - - '@floating-ui/dom@1.7.6': - resolution: {integrity: sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==} - - '@floating-ui/react-dom@2.1.8': - resolution: {integrity: sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==} - peerDependencies: - react: '>=16.8.0' - react-dom: '>=16.8.0' - - '@floating-ui/utils@0.2.11': - resolution: {integrity: sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==} - - '@hono/node-server@1.19.14': - resolution: {integrity: sha512-GwtvgtXxnWsucXvbQXkRgqksiH2Qed37H9xHZocE5sA3N8O8O8/8FA3uclQXxXVzc9XBZuEOMK7+r02FmSpHtw==} - engines: {node: '>=18.14.1'} - peerDependencies: - hono: ^4 - - '@img/colour@1.1.0': - resolution: {integrity: sha512-Td76q7j57o/tLVdgS746cYARfSyxk8iEfRxewL9h4OMzYhbW4TAcppl0mT4eyqXddh6L/jwoM75mo7ixa/pCeQ==} - engines: {node: '>=18'} - - '@img/sharp-darwin-arm64@0.35.3': - resolution: {integrity: sha512-RMnFX7YQsMoh7lWfcM4NEHHymBX/rLuKNPVM84XE9ONPcaSCDgE7CHIHpSgPcO2xcRthgBy1HfNO319mwhIAkg==} - engines: {node: '>=20.9.0'} - cpu: [arm64] - os: [darwin] - - '@img/sharp-darwin-x64@0.35.3': - resolution: {integrity: sha512-Xo+5uFBtLN0BKqieTxiFzFPQAUlBbbH5iBKyRX/z1JrbnYsHTfKJnUfL8+p2TPXr1pXqao4eeL4Rl144uDpK9w==} - engines: {node: '>=20.9.0'} - cpu: [x64] - os: [darwin] - - '@img/sharp-freebsd-wasm32@0.35.3': - resolution: {integrity: sha512-lUxcqWIj2wMQ9BrwNjngcr1gWUr5xgaGThBRqPPalIC2n67Cqj1uPh8NnA/ZhAg8hUbKl+kVHKwgUIwe6ZYPrg==} - engines: {node: '>=20.9.0'} - os: [freebsd] - - '@img/sharp-libvips-darwin-arm64@1.3.2': - resolution: {integrity: sha512-9J6ypZFpQBj4YnePGoq/S38w6nz+vqg5WZLrLGY4YuSemdMq47GMLBPO42MzwdGwpg/agZ7xzZcFHa48xlywfg==} - cpu: [arm64] - os: [darwin] - - '@img/sharp-libvips-darwin-x64@1.3.2': - resolution: {integrity: sha512-m2pW1n6cns9VaubNwsZ+c3CRYjxNQWgJ5gPlnL1nbBcpkBvFm6SCFN5o0psFHI8w9n11NKhFkeEDns98tiqbEw==} - cpu: [x64] - os: [darwin] - - '@img/sharp-libvips-linux-arm64@1.3.2': - resolution: {integrity: sha512-dqVSFynCox4C/J8kT16V7SIFAns0IjgLwkvYT7p8LQVmJ5OS5b6tI9IGflxTeuBS//zXeFIUbwt5dwxyZ17cnA==} - cpu: [arm64] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linux-arm@1.3.2': - resolution: {integrity: sha512-1eMLzy92I4J6rmi4mAT8yC3HxOtniyGELlzGbNMLLeqe052ahFQ0h6LFq+lh5DsDIdYViIDst08abvSbcEdLXQ==} - cpu: [arm] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linux-ppc64@1.3.2': - resolution: {integrity: sha512-3z0NHDxD6n5I9gc05U1eW1AyRm+Gznzq3naMrthPNqE6oYykcogW0l/jfpJdjYnuNl8R7yI9pNbE1XiUeyq0Aw==} - cpu: [ppc64] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linux-riscv64@1.3.2': - resolution: {integrity: sha512-bsb4rI+NldGOsXuej2r8OdSS8+zXDVaCWxyWrcv6kneTOlgAHtZABRzBBCwdsPiD90J4myNJuHpg6kA20ImW/w==} - cpu: [riscv64] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linux-s390x@1.3.2': - resolution: {integrity: sha512-/ABshyj8gCpyIrNXnHn4LorDJ0HHm1VhXPBlxZ8zAtfVPAaSafXPGn+sUSIRiwaSBy0mmFjSjiXI5mkcwdChKQ==} - cpu: [s390x] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linux-x64@1.3.2': - resolution: {integrity: sha512-ITPEtgffGJ0S6G9dRyw/366tJQqFRcHWPHhC+Stpg3Z8AEMrDrTr2lhdz4f/Y/HMbRh//7Z5mBzEpVdi62Oc3w==} - cpu: [x64] - os: [linux] - libc: [glibc] - - '@img/sharp-libvips-linuxmusl-arm64@1.3.2': - resolution: {integrity: sha512-zE9EdiUzUmg5mDT5a1rk5fYJ6GWPloTwWBYDS14naqHsL+EaMpDj1AWnpLgh3u0YCORv2Tt50wrcrpYqkP97Kw==} - cpu: [arm64] - os: [linux] - libc: [musl] - - '@img/sharp-libvips-linuxmusl-x64@1.3.2': - resolution: {integrity: sha512-m0lrLiUt+lBYnCFr8qV/65yMR4E/c7/wf78I5eKTdkEakFAlZ9QlzEM3QIhhAwVeUhLAHLcCq7a7Vszq/oFNZQ==} - cpu: [x64] - os: [linux] - libc: [musl] - - '@img/sharp-linux-arm64@0.35.3': - resolution: {integrity: sha512-QgKDspHPnrU+GQ55XPhGwyhC8acLVOOSyAvo1oVfFmrIXLkDNmGWzAfDZ4xK8oSA1qBQrALcHX0G5UZni/SuFQ==} - engines: {node: '>=20.9.0'} - cpu: [arm64] - os: [linux] - libc: [glibc] - - '@img/sharp-linux-arm@0.35.3': - resolution: {integrity: sha512-affVWCTLooy8TSxbDx2qkzuDeaWLNVBA+P//FNBirHsXpP2fuBhk5AuboYUnrDnzoXes8GFjpTx0SBFOCRg+FA==} - engines: {node: '>=20.9.0'} - cpu: [arm] - os: [linux] - libc: [glibc] - - '@img/sharp-linux-ppc64@0.35.3': - resolution: {integrity: sha512-sMd8rDxmpLOwv/7N44klFjOD5DUO7FLdjiXDI0hoxYaf7Ar262dQIEkosE98bps+5HPLtp/EvNqeqQtOycP/IA==} - engines: {node: '>=20.9.0'} - cpu: [ppc64] - os: [linux] - libc: [glibc] - - '@img/sharp-linux-riscv64@0.35.3': - resolution: {integrity: sha512-0Eob78yjlYPfL5vMNWAW55l3R9Y6BQS/gOfe0ZcP9mEz9ohhKSt4im1hayiknXgf8AWrFqMvJcKIdmLmEe7yeQ==} - engines: {node: '>=20.9.0'} - cpu: [riscv64] - os: [linux] - libc: [glibc] - - '@img/sharp-linux-s390x@0.35.3': - resolution: {integrity: sha512-KgAxQ0DxpNOq1rG2t5cgTgShJFGSuU7XO45cqC+1NVOuZnP6tlgZRuSYOfNupGkHID0o3cJOsw4DVeJpMovcGw==} - engines: {node: '>=20.9.0'} - cpu: [s390x] - os: [linux] - libc: [glibc] - - '@img/sharp-linux-x64@0.35.3': - resolution: {integrity: sha512-8pqvxubL2PGdhlPy6GLqzDYMUjyRmKAwKHYKixpdJYBUK7PJ0C029XdsnpFIdgRZG68fZiGdHVWcKPvtiPB4cA==} - engines: {node: '>=20.9.0'} - cpu: [x64] - os: [linux] - libc: [glibc] - - '@img/sharp-linuxmusl-arm64@0.35.3': - resolution: {integrity: sha512-Vz0iQjzzcSX3HCbfwFfCSG/9SCIqyO0mH2sXyiHaAYfBk0cRsCWXRyQYX0ovCK/PAQBbTzQ0dsPQHh5MAFL59w==} - engines: {node: '>=20.9.0'} - cpu: [arm64] - os: [linux] - libc: [musl] - - '@img/sharp-linuxmusl-x64@0.35.3': - resolution: {integrity: sha512-6O1NPKcDVj9QEdg7Hx549EX8U0rp6yXQERqru6yRN7fGBn32UvIRJUlWnk+8xDCiG76hXVBbX82NZ/ZKr0euIg==} - engines: {node: '>=20.9.0'} - cpu: [x64] - os: [linux] - libc: [musl] - - '@img/sharp-wasm32@0.35.3': - resolution: {integrity: sha512-cZ0XkcYGpHZkqW6iCkqTcmUC0CD9DhD5d/qeZlZkfRBn6GnHniZXLUo5+9xw8Iv76YE6LQFN9YNBlKREcCG76w==} - engines: {node: '>=20.9.0'} - - '@img/sharp-webcontainers-wasm32@0.35.3': - resolution: {integrity: sha512-2rnq7bX3NzeR2T4YWgz8qiG4h3TSdMe+vN1iQXpJleSJ3SM5zQ8Fy2SyyXAWlbxpEZ2Y+Z4u1BePgJEYbSy80Q==} - engines: {node: '>=20.9.0'} - cpu: [wasm32] - - '@img/sharp-win32-arm64@0.35.3': - resolution: {integrity: sha512-4bPwFdMbeC4JQ8L8LOyWp6nsHcboP5fxkp6iPOXz2Vg49R42TuMs2whkJ5OAP4/Ul035qOzy0AecOF9VOscn4w==} - engines: {node: '>=20.9.0'} - cpu: [arm64] - os: [win32] - - '@img/sharp-win32-ia32@0.35.3': - resolution: {integrity: sha512-r53mXsBN6lFUDiST764SvgwUdHAqM4rPAiDzAmf4fLoB6X/rkfyTrLCg6+g17wJJiCmB3JYgHuUldCWUIRFSXw==} - engines: {node: ^20.9.0} - cpu: [ia32] - os: [win32] - - '@img/sharp-win32-x64@0.35.3': - resolution: {integrity: sha512-D4y1vNeZrIIJCN+uHaWVtH86B+aCrdMYYjicy9pXHvbGZeGYLLSd3wdVuC37FxVXlU1ARsk84eKWfWMXGYEqvA==} - engines: {node: '>=20.9.0'} - cpu: [x64] - os: [win32] - - '@inquirer/ansi@2.0.7': - resolution: {integrity: sha512-3eTuUO1vH2cZm2ZKHeQxnOqlTi9EfZDGgIe3BL3I4u+rJHocr9Fz86M4fjYABPvFnQG/gGK551HqDiIcETwU6Q==} - engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'} - - '@inquirer/confirm@6.1.1': - resolution: {integrity: sha512-eb8DBZcz/2qHWQda4rk2JiQk5h9QV/cVHi1yjt0f69WFZMRFn0sJTye3EAP8icut8UDMjQPsaH5KbcOogefrFQ==} - engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'} - peerDependencies: - '@types/node': '>=18' - peerDependenciesMeta: - '@types/node': - optional: true - - '@inquirer/core@11.2.1': - resolution: {integrity: sha512-Qd6GJT1yVyrZZCfN8W2qKF5ApmqryXRhRKCuip8h01x2w/esJQ2XIYc6f9abMIHgKQdBfFTSOdbHRLAhuM09UA==} - engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'} - peerDependencies: - '@types/node': '>=18' - peerDependenciesMeta: - '@types/node': - optional: true - - '@inquirer/figures@2.0.7': - resolution: {integrity: sha512-aJ8TBPOGB6f/2qziPfElISTCEd5XOYTFckA2SGjhNmiKzfK/u4ot3v0DUzGVdUnKjN10EqnnEPck36BkyfLnJw==} - engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'} - - '@inquirer/type@4.0.7': - resolution: {integrity: sha512-t28inv14nMQ1PhKpsJPY+kEs/c00qzeCOS2gTNRyTjG5d6qsVA2fItxW4hkvGZ5lvanGLdtCzVIx5dwdRpN1+g==} - engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'} - peerDependencies: - '@types/node': '>=18' - peerDependenciesMeta: - '@types/node': - optional: true - - '@jridgewell/gen-mapping@0.3.13': - resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==} - - '@jridgewell/remapping@2.3.5': - resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==} - - '@jridgewell/resolve-uri@3.1.2': - resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==} - engines: {node: '>=6.0.0'} - - '@jridgewell/sourcemap-codec@1.5.5': - resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==} - - '@jridgewell/trace-mapping@0.3.31': - resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==} - - '@modelcontextprotocol/sdk@1.29.0': - resolution: {integrity: sha512-zo37mZA9hJWpULgkRpowewez1y6ML5GsXJPY8FI0tBBCd77HEvza4jDqRKOXgHNn867PVGCyTdzqpz0izu5ZjQ==} - engines: {node: '>=18'} - peerDependencies: - '@cfworker/json-schema': ^4.1.1 - zod: ^3.25 || ^4.0 - peerDependenciesMeta: - '@cfworker/json-schema': - optional: true - - '@mswjs/interceptors@0.41.9': - resolution: {integrity: sha512-VVPPgHyQ6ShqnrmDWuxjmUIsO9gWyOZFmuOfLd9LfBGQJwZfy0gvv9pbHSJuoFNIYC7ZDX9aoFwowjcdSC4E8w==} - engines: {node: '>=18'} - - '@next/env@16.3.0': - resolution: {integrity: sha512-o9r1S0BNiNreHP9Vs+Qnqd9kviDkJh8xIACY7UFZSmiGbbQRzPBBosvHzAU4TULHOIuOj/18RSsyz2qrREmIFw==} - - '@next/swc-darwin-arm64@16.3.0': - resolution: {integrity: sha512-55hpqq18bEVAlxedlTt3tFqZmKg2nUXT1kn1G/BGEy0R13h3LwtwHPVzzjG6P4LLeOHE32PFDQUVaJEWvBEZBw==} - engines: {node: '>= 10'} - cpu: [arm64] - os: [darwin] - - '@next/swc-darwin-x64@16.3.0': - resolution: {integrity: sha512-SOi96kSaF5T+0wW4koiM1bWzSPwjzTesC1p3df+FjdOi5LIQkBK/blxh7HdoKnNuI4PURF1OO7TZqtfnbWDSgw==} - engines: {node: '>= 10'} - cpu: [x64] - os: [darwin] - - '@next/swc-linux-arm64-gnu@16.3.0': - resolution: {integrity: sha512-P0gZAoPMF4dyTRzhmkV4PrqVzSOB6t4mC1oI3c4dqijJ+OVEVx5clIXAKR4/uQpsqw2KKM/0D5tVumcR2r5blg==} - engines: {node: '>= 10'} - cpu: [arm64] - os: [linux] - libc: [glibc] - - '@next/swc-linux-arm64-musl@16.3.0': - resolution: {integrity: sha512-tXXGKJw0m37O0eKJARVTX/TheKPhz0QFVtVVZXmOig+9YKLQOSP6hvf2pxv5DO7CLEJyTHx3Pg043CDQkv1G4Q==} - engines: {node: '>= 10'} - cpu: [arm64] - os: [linux] - libc: [musl] - - '@next/swc-linux-x64-gnu@16.3.0': - resolution: {integrity: sha512-pjGxK5EY7yWml78ALejFkWmgHsU7wbFQrISiugpH6FbUJhgEvw3xFZ/EBAtLl7QtL0WdQKiG9eWJ3mOKGTukHw==} - engines: {node: '>= 10'} - cpu: [x64] - os: [linux] - libc: [glibc] - - '@next/swc-linux-x64-musl@16.3.0': - resolution: {integrity: sha512-sjo++Xx+lomlPs3HRsHWhVDyGG6ms1kGW5EtHLERdII8AyG1i+f6aq68xHREO6AEMlhjTNEWBSmfJfqm9orf7g==} - engines: {node: '>= 10'} - cpu: [x64] - os: [linux] - libc: [musl] - - '@next/swc-win32-arm64-msvc@16.3.0': - resolution: {integrity: sha512-C5JSgiO54wURdaxdEUIXqkz04uMqC9UmPX1gtDrV/5Tf1UowdWYI8uA5hfFbPolTlp0q4KZ60xlHePNibf0VIw==} - engines: {node: '>= 10'} - cpu: [arm64] - os: [win32] - - '@next/swc-win32-x64-msvc@16.3.0': - resolution: {integrity: sha512-fDOggsweNb5SSw0ZKVk6U+gxSyGFFlIBY/LBc1r8GUj4u/6t6oArL+Pmkg0MBnsgR+KkdsURilVH4F3GXUGepA==} - engines: {node: '>= 10'} - cpu: [x64] - os: [win32] - - '@noble/ciphers@1.3.0': - resolution: {integrity: sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw==} - engines: {node: ^14.21.3 || >=16} - - '@noble/curves@1.9.7': - resolution: {integrity: sha512-gbKGcRUYIjA3/zCCNaWDciTMFI0dCkvou3TL8Zmy5Nc7sJ47a0jtOeZoTaMxkuqRo9cRhjOdZJXegxYE5FN/xw==} - engines: {node: ^14.21.3 || >=16} - - '@noble/hashes@1.8.0': - resolution: {integrity: sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==} - engines: {node: ^14.21.3 || >=16} - - '@nodelib/fs.scandir@2.1.5': - resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} - engines: {node: '>= 8'} - - '@nodelib/fs.stat@2.0.5': - resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==} - engines: {node: '>= 8'} - - '@nodelib/fs.walk@1.2.8': - resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==} - engines: {node: '>= 8'} - - '@open-draft/deferred-promise@2.2.0': - resolution: {integrity: sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==} - - '@open-draft/deferred-promise@3.0.0': - resolution: {integrity: sha512-XW375UK8/9SqUVNVa6M0yEy8+iTi4QN5VZ7aZuRFQmy76LRwI9wy5F4YIBU6T+eTe2/DNDo8tqu8RHlwLHM6RA==} - - '@open-draft/logger@0.3.0': - resolution: {integrity: sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ==} - - '@open-draft/until@2.1.0': - resolution: {integrity: sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==} - - '@sec-ant/readable-stream@0.4.1': - resolution: {integrity: sha512-831qok9r2t8AlxLko40y2ebgSDhenenCatLVeW/uBtnHPyhHOvG0C7TvfgecV+wHzIm5KUICgzmVpWS+IMEAeg==} - - '@sindresorhus/merge-streams@4.0.0': - resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==} - engines: {node: '>=18'} - - '@swc/helpers@0.5.15': - resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==} - - '@tailwindcss/node@4.3.3': - resolution: {integrity: sha512-/T8IKEsf9VTU6tLjgC7+sv2mOPtQxzE2jMw7u4Tt40Tx+QSZxpzh95/H6cMKoja9XuW7iMdLJYBB0o9G1CaAgg==} - - '@tailwindcss/oxide-android-arm64@4.3.3': - resolution: {integrity: sha512-Y85A2gmPSkl5Ve5qR86GL4HT509cFqQh1aes9p3sSkyTPwt0Pppf3GkwGe4JPACcRYjgJIEhQgM6dBClnr0NYw==} - engines: {node: '>= 20'} - cpu: [arm64] - os: [android] - - '@tailwindcss/oxide-darwin-arm64@4.3.3': - resolution: {integrity: sha512-BiaWatpBcERQFDlOjRDpIVXuFK5PJez5SA4JMg6VYZdBYU+qKfV/vqjcIs+IYmtitf1xYQZTwXvU/8y4lfZUGw==} - engines: {node: '>= 20'} - cpu: [arm64] - os: [darwin] - - '@tailwindcss/oxide-darwin-x64@4.3.3': - resolution: {integrity: sha512-fAeUqfV5ndhxRwai8cXGzdLvul9utWOmeTkv69unv4ZXixjn61Z+p9lCWdwOwA3TYboG3BwdVuN/RDjhBRl0mw==} - engines: {node: '>= 20'} - cpu: [x64] - os: [darwin] - - '@tailwindcss/oxide-freebsd-x64@4.3.3': - resolution: {integrity: sha512-iyf5bV6+wnAlflVeEy7R25dupxTNECZN5QMI0qNT6eT+EgaGdZcKhGkr5SdoaWiLJ3spLqIY9VCeSGrwmtg4kw==} - engines: {node: '>= 20'} - cpu: [x64] - os: [freebsd] - - '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.3': - resolution: {integrity: sha512-aAYUprJAJQWWbRrPvtjdroZ56Md+JM8pMiopS6xGEwDfLhqj+2ver2p4nU4Mb3CRqcMmNBjo8KkUgcxhkzVQGQ==} - engines: {node: '>= 20'} - cpu: [arm] - os: [linux] - - '@tailwindcss/oxide-linux-arm64-gnu@4.3.3': - resolution: {integrity: sha512-nDxldcEENOxZRzC2uu9jrutZdAAQtb+8WWDCSnWL1zvBk1+FN+x6MtDViPB5AJMfttVCUhehGWus3XBPgatM/w==} - engines: {node: '>= 20'} - cpu: [arm64] - os: [linux] - libc: [glibc] - - '@tailwindcss/oxide-linux-arm64-musl@4.3.3': - resolution: {integrity: sha512-Md44bD6veX/PC5iyF8cDVnw4HBIANZepRZZ7a8DQOvkfo5WUBwcp6iAuCUz23u+4SUkhJlD3eL7hNdW8ezd/kA==} - engines: {node: '>= 20'} - cpu: [arm64] - os: [linux] - libc: [musl] - - '@tailwindcss/oxide-linux-x64-gnu@4.3.3': - resolution: {integrity: sha512-tx7us1muwOKAKWao2v/GaafFeQboE6aj88vC6ziN2NCGcRm8gWUhwjzg+YdVB1e4boAtdtma4L43onunI6NS4w==} - engines: {node: '>= 20'} - cpu: [x64] - os: [linux] - libc: [glibc] - - '@tailwindcss/oxide-linux-x64-musl@4.3.3': - resolution: {integrity: sha512-SJxX60smvHgasZoBy11dX6YRjXJFovwWBoedhbQPOBzgFWBHGB+TVPWB9BxzR7TTxU8FQZAI2AyiNCMzFm8Img==} - engines: {node: '>= 20'} - cpu: [x64] - os: [linux] - libc: [musl] - - '@tailwindcss/oxide-wasm32-wasi@4.3.3': - resolution: {integrity: sha512-jx1+rPhY/5Ympkktd656HBWEBLxP7dH06losBLjjf5vgCODXvi9KhtftWcMIwTFIDqBr7cRnQkdLnAG+IOlGvQ==} - engines: {node: '>=14.0.0'} - cpu: [wasm32] - bundledDependencies: - - '@napi-rs/wasm-runtime' - - '@emnapi/core' - - '@emnapi/runtime' - - '@tybys/wasm-util' - - '@emnapi/wasi-threads' - - tslib - - '@tailwindcss/oxide-win32-arm64-msvc@4.3.3': - resolution: {integrity: sha512-3rc292Ca2ceK6Ulcc/bAVnTs/3nDtoPhyEKlgPv+yQJQi/JS/AMJlqzxvlDacL1nekbrcf6bTqp/jV4qgnPxNQ==} - engines: {node: '>= 20'} - cpu: [arm64] - os: [win32] - - '@tailwindcss/oxide-win32-x64-msvc@4.3.3': - resolution: {integrity: sha512-yJ0pwIVc/nYeGoV02WtsN8KYyLQv7kyI2wDnkezyJlGGjkd4QLwDGAwl47YpPJeuI0M0ObaXGSPjvWDPeTPggw==} - engines: {node: '>= 20'} - cpu: [x64] - os: [win32] - - '@tailwindcss/oxide@4.3.3': - resolution: {integrity: sha512-krXjAikiaFSPaK/FkAQT5UTx3VormQaiZ5hBFlJZ9UFQGB/rwg1MZIhHAG9smMQRTdyJxP6Qt5MwMtdyU5FWrA==} - engines: {node: '>= 20'} - - '@tailwindcss/postcss@4.3.3': - resolution: {integrity: sha512-JTSZZGQi1AyKirbLN3azmjVzef92tcX7h+iSqPdaeStyFpGpDlKvvpxeOE8njhbUanbRwr3z8DyzhICWnMtQeg==} - - '@ts-morph/common@0.27.0': - resolution: {integrity: sha512-Wf29UqxWDpc+i61k3oIOzcUfQt79PIT9y/MWfAGlrkjg6lBC1hwDECLXPVJAhWjiGbfBCxZd65F/LIZF3+jeJQ==} - - '@types/node@24.10.4': - resolution: {integrity: sha512-vnDVpYPMzs4wunl27jHrfmwojOGKya0xyM3sH+UE5iv5uPS6vX7UIoh6m+vQc5LGBq52HBKPIn/zcSZVzeDEZg==} - - '@types/react-dom@19.2.3': - resolution: {integrity: sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==} - peerDependencies: - '@types/react': ^19.2.0 - - '@types/react@19.2.14': - resolution: {integrity: sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==} - - '@types/set-cookie-parser@2.4.10': - resolution: {integrity: sha512-GGmQVGpQWUe5qglJozEjZV/5dyxbOOZ0LHe/lqyWssB88Y4svNfst0uqBVscdDeIKl5Jy5+aPSvy7mI9tYRguw==} - - '@types/statuses@2.0.6': - resolution: {integrity: sha512-xMAgYwceFhRA2zY+XbEA7mxYbA093wdiW8Vu6gZPGWy9cmOyU9XesH1tNcEWsKFd5Vzrqx5T3D38PWx1FIIXkA==} - - '@types/validate-npm-package-name@4.0.2': - resolution: {integrity: sha512-lrpDziQipxCEeK5kWxvljWYhUvOiB2A9izZd9B2AFarYAkqZshb4lPbRs7zKEic6eGtH8V/2qJW+dPp9OtF6bw==} - - '@vercel/analytics@1.6.1': - resolution: {integrity: sha512-oH9He/bEM+6oKlv3chWuOOcp8Y6fo6/PSro8hEkgCW3pu9/OiCXiUpRUogDh3Fs3LH2sosDrx8CxeOLBEE+afg==} - peerDependencies: - '@remix-run/react': ^2 - '@sveltejs/kit': ^1 || ^2 - next: '>= 13' - react: ^18 || ^19 || ^19.0.0-rc - svelte: '>= 4' - vue: ^3 - vue-router: ^4 - peerDependenciesMeta: - '@remix-run/react': - optional: true - '@sveltejs/kit': - optional: true - next: - optional: true - react: - optional: true - svelte: - optional: true - vue: - optional: true - vue-router: - optional: true - - accepts@2.0.0: - resolution: {integrity: sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==} - engines: {node: '>= 0.6'} - - agent-base@7.1.4: - resolution: {integrity: sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==} - engines: {node: '>= 14'} - - ajv-formats@3.0.1: - resolution: {integrity: sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==} - peerDependencies: - ajv: ^8.0.0 - peerDependenciesMeta: - ajv: - optional: true - - ajv@8.20.0: - resolution: {integrity: sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==} - - ansi-colors@4.1.3: - resolution: {integrity: sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==} - engines: {node: '>=6'} - - ansi-regex@5.0.1: - resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==} - engines: {node: '>=8'} - - ansi-regex@6.2.2: - resolution: {integrity: sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==} - engines: {node: '>=12'} - - ansi-styles@4.3.0: - resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==} - engines: {node: '>=8'} - - argparse@2.0.1: - resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} - - ast-types@0.16.1: - resolution: {integrity: sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==} - engines: {node: '>=4'} - - balanced-match@4.0.4: - resolution: {integrity: sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==} - engines: {node: 18 || 20 || >=22} - - baseline-browser-mapping@2.9.19: - resolution: {integrity: sha512-ipDqC8FrAl/76p2SSWKSI+H9tFwm7vYqXQrItCuiVPt26Km0jS+NzSsBWAaBusvSbQcfJG+JitdMm+wZAgTYqg==} - hasBin: true - - body-parser@2.2.2: - resolution: {integrity: sha512-oP5VkATKlNwcgvxi0vM0p/D3n2C3EReYVX+DNYs5TjZFn/oQt2j+4sVJtSMr18pdRr8wjTcBl6LoV+FUwzPmNA==} - engines: {node: '>=18'} - - brace-expansion@5.0.6: - resolution: {integrity: sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==} - engines: {node: 18 || 20 || >=22} - - braces@3.0.3: - resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==} - engines: {node: '>=8'} - - browserslist@4.28.1: - resolution: {integrity: sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA==} - engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} - hasBin: true - - bundle-name@4.1.0: - resolution: {integrity: sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==} - engines: {node: '>=18'} - - bytes@3.1.2: - resolution: {integrity: sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==} - engines: {node: '>= 0.8'} - - call-bind-apply-helpers@1.0.2: - resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==} - engines: {node: '>= 0.4'} - - call-bound@1.0.4: - resolution: {integrity: sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==} - engines: {node: '>= 0.4'} - - callsites@3.1.0: - resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==} - engines: {node: '>=6'} - - caniuse-lite@1.0.30001769: - resolution: {integrity: sha512-BCfFL1sHijQlBGWBMuJyhZUhzo7wer5sVj9hqekB/7xn0Ypy+pER/edCYQm4exbXj4WiySGp40P8UuTh6w1srg==} - - chalk@5.6.2: - resolution: {integrity: sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==} - engines: {node: ^12.17.0 || ^14.13 || >=16.0.0} - - class-variance-authority@0.7.1: - resolution: {integrity: sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==} - - cli-cursor@5.0.0: - resolution: {integrity: sha512-aCj4O5wKyszjMmDT4tZj93kxyydN/K5zPWSCe6/0AV/AA1pqe5ZBIw0a2ZfPQV7lL5/yb5HsUreJ6UFAF1tEQw==} - engines: {node: '>=18'} - - cli-spinners@2.9.2: - resolution: {integrity: sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==} - engines: {node: '>=6'} - - cli-width@4.1.0: - resolution: {integrity: sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==} - engines: {node: '>= 12'} - - client-only@0.0.1: - resolution: {integrity: sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==} - - cliui@8.0.1: - resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==} - engines: {node: '>=12'} - - clsx@2.1.1: - resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} - engines: {node: '>=6'} - - code-block-writer@13.0.3: - resolution: {integrity: sha512-Oofo0pq3IKnsFtuHqSF7TqBfr71aeyZDVJ0HpmqB7FBM2qEigL0iPONSCZSO9pE9dZTAxANe5XHG9Uy0YMv8cg==} - - color-convert@2.0.1: - resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==} - engines: {node: '>=7.0.0'} - - color-name@1.1.4: - resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==} - - commander@11.1.0: - resolution: {integrity: sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==} - engines: {node: '>=16'} - - commander@14.0.3: - resolution: {integrity: sha512-H+y0Jo/T1RZ9qPP4Eh1pkcQcLRglraJaSLoyOtHxu6AapkjWVCy2Sit1QQ4x3Dng8qDlSsZEet7g5Pq06MvTgw==} - engines: {node: '>=20'} - - content-disposition@1.1.0: - resolution: {integrity: sha512-5jRCH9Z/+DRP7rkvY83B+yGIGX96OYdJmzngqnw2SBSxqCFPd0w2km3s5iawpGX8krnwSGmF0FW5Nhr0Hfai3g==} - engines: {node: '>=18'} - - content-type@1.0.5: - resolution: {integrity: sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==} - engines: {node: '>= 0.6'} - - content-type@2.0.0: - resolution: {integrity: sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==} - engines: {node: '>=18'} - - convert-source-map@2.0.0: - resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==} - - cookie-signature@1.2.2: - resolution: {integrity: sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==} - engines: {node: '>=6.6.0'} - - cookie@0.7.2: - resolution: {integrity: sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==} - engines: {node: '>= 0.6'} - - cookie@1.1.1: - resolution: {integrity: sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==} - engines: {node: '>=18'} - - cors@2.8.6: - resolution: {integrity: sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==} - engines: {node: '>= 0.10'} - - cosmiconfig@9.0.1: - resolution: {integrity: sha512-hr4ihw+DBqcvrsEDioRO31Z17x71pUYoNe/4h6Z0wB72p7MU7/9gH8Q3s12NFhHPfYBBOV3qyfUxmr/Yn3shnQ==} - engines: {node: '>=14'} - peerDependencies: - typescript: '>=4.9.5' - peerDependenciesMeta: - typescript: - optional: true - - cross-spawn@7.0.6: - resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==} - engines: {node: '>= 8'} - - cssesc@3.0.0: - resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==} - engines: {node: '>=4'} - hasBin: true - - csstype@3.2.3: - resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==} - - data-uri-to-buffer@4.0.1: - resolution: {integrity: sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==} - engines: {node: '>= 12'} - - date-fns@4.1.0: - resolution: {integrity: sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==} - - debug@4.4.3: - resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==} - engines: {node: '>=6.0'} - peerDependencies: - supports-color: '*' - peerDependenciesMeta: - supports-color: - optional: true - - dedent@1.7.2: - resolution: {integrity: sha512-WzMx3mW98SN+zn3hgemf4OzdmyNhhhKz5Ay0pUfQiMQ3e1g+xmTJWp/pKdwKVXhdSkAEGIIzqeuWrL3mV/AXbA==} - peerDependencies: - babel-plugin-macros: ^3.1.0 - peerDependenciesMeta: - babel-plugin-macros: - optional: true - - deepmerge@4.3.1: - resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==} - engines: {node: '>=0.10.0'} - - default-browser-id@5.0.1: - resolution: {integrity: sha512-x1VCxdX4t+8wVfd1so/9w+vQ4vx7lKd2Qp5tDRutErwmR85OgmfX7RlLRMWafRMY7hbEiXIbudNrjOAPa/hL8Q==} - engines: {node: '>=18'} - - default-browser@5.5.0: - resolution: {integrity: sha512-H9LMLr5zwIbSxrmvikGuI/5KGhZ8E2zH3stkMgM5LpOWDutGM2JZaj460Udnf1a+946zc7YBgrqEWwbk7zHvGw==} - engines: {node: '>=18'} - - define-lazy-prop@3.0.0: - resolution: {integrity: sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==} - engines: {node: '>=12'} - - depd@2.0.0: - resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==} - engines: {node: '>= 0.8'} - - detect-libc@2.1.2: - resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==} - engines: {node: '>=8'} - - diff@8.0.4: - resolution: {integrity: sha512-DPi0FmjiSU5EvQV0++GFDOJ9ASQUVFh5kD+OzOnYdi7n3Wpm9hWWGfB/O2blfHcMVTL5WkQXSnRiK9makhrcnw==} - engines: {node: '>=0.3.1'} - - dotenv@17.4.2: - resolution: {integrity: sha512-nI4U3TottKAcAD9LLud4Cb7b2QztQMUEfHbvhTH09bqXTxnSie8WnjPALV/WMCrJZ6UV/qHJ6L03OqO3LcdYZw==} - engines: {node: '>=12'} - - dunder-proto@1.0.1: - resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==} - engines: {node: '>= 0.4'} - - eciesjs@0.4.18: - resolution: {integrity: sha512-wG99Zcfcys9fZux7Cft8BAX/YrOJLJSZ3jyYPfhZHqN2E+Ffx+QXBDsv3gubEgPtV6dTzJMSQUwk1H98/t/0wQ==} - engines: {bun: '>=1', deno: '>=2', node: '>=16'} - - ee-first@1.1.1: - resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==} - - electron-to-chromium@1.5.286: - resolution: {integrity: sha512-9tfDXhJ4RKFNerfjdCcZfufu49vg620741MNs26a9+bhLThdB+plgMeou98CAaHu/WATj2iHOOHTp1hWtABj2A==} - - emoji-regex@10.6.0: - resolution: {integrity: sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==} - - emoji-regex@8.0.0: - resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==} - - encodeurl@2.0.0: - resolution: {integrity: sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==} - engines: {node: '>= 0.8'} - - enhanced-resolve@5.24.2: - resolution: {integrity: sha512-rpsZEGT1jFuve6QlpyRp9ckQ+kN61hvF9BzCPyMdaKTm8UJce96KBn3sorXOFXlzjPrs3Vc4T1NsSroZ3PxlFw==} - engines: {node: '>=10.13.0'} - - enquirer@2.4.1: - resolution: {integrity: sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==} - engines: {node: '>=8.6'} - - env-paths@2.2.1: - resolution: {integrity: sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==} - engines: {node: '>=6'} - - error-ex@1.3.4: - resolution: {integrity: sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==} - - es-define-property@1.0.1: - resolution: {integrity: sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==} - engines: {node: '>= 0.4'} - - es-errors@1.3.0: - resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==} - engines: {node: '>= 0.4'} - - es-object-atoms@1.1.2: - resolution: {integrity: sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==} - engines: {node: '>= 0.4'} - - escalade@3.2.0: - resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==} - engines: {node: '>=6'} - - escape-html@1.0.3: - resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==} - - esprima@4.0.1: - resolution: {integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==} - engines: {node: '>=4'} - hasBin: true - - etag@1.8.1: - resolution: {integrity: sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==} - engines: {node: '>= 0.6'} - - eventsource-parser@3.1.0: - resolution: {integrity: sha512-kJezFj9YFAMLeORyi7aCLxLbD5/qWMQnoMVlVPyHIll7lgRJCc3JVln9Vgl9nwQi0YkMnhdGTMNn7CkRRAptMg==} - engines: {node: '>=18.0.0'} - - eventsource@3.0.7: - resolution: {integrity: sha512-CRT1WTyuQoD771GW56XEZFQ/ZoSfWid1alKGDYMmkt2yl8UXrVR4pspqWNEcqKvVIzg6PAltWjxcSSPrboA4iA==} - engines: {node: '>=18.0.0'} - - execa@5.1.1: - resolution: {integrity: sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==} - engines: {node: '>=10'} - - execa@9.6.1: - resolution: {integrity: sha512-9Be3ZoN4LmYR90tUoVu2te2BsbzHfhJyfEiAVfz7N5/zv+jduIfLrV2xdQXOHbaD6KgpGdO9PRPM1Y4Q9QkPkA==} - engines: {node: ^18.19.0 || >=20.5.0} - - express-rate-limit@8.5.2: - resolution: {integrity: sha512-5Kb34ipNX694DH48vN9irak1Qx30nb0PLYHXfJgw4YEjiC3ZEmZJhwOp+VfiCYwFzvFTdB9QkArYS5kXa2cx2A==} - engines: {node: '>= 16'} - peerDependencies: - express: '>= 4.11' - - express@5.2.1: - resolution: {integrity: sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==} - engines: {node: '>= 18'} - - fast-deep-equal@3.1.3: - resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} - - fast-glob@3.3.3: - resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==} - engines: {node: '>=8.6.0'} - - fast-string-truncated-width@3.0.3: - resolution: {integrity: sha512-0jjjIEL6+0jag3l2XWWizO64/aZVtpiGE3t0Zgqxv0DPuxiMjvB3M24fCyhZUO4KomJQPj3LTSUnDP3GpdwC0g==} - - fast-string-width@3.0.2: - resolution: {integrity: sha512-gX8LrtNEI5hq8DVUfRQMbr5lpaS4nMIWV+7XEbXk2b8kiQIizgnlr12B4dA3ZEx3308ze0O4Q1R+cHts8kyUJg==} - - fast-uri@3.1.2: - resolution: {integrity: sha512-rVjf7ArG3LTk+FS6Yw81V1DLuZl1bRbNrev6Tmd/9RaroeeRRJhAt7jg/6YFxbvAQXUCavSoZhPPj6oOx+5KjQ==} - - fast-wrap-ansi@0.2.2: - resolution: {integrity: sha512-7F2Fl+TjRSenLqlU3UjSH0iyqopqoZIu7eZVpEirP2g1GtWa2G/ecEmBdgz31+Mxr+ELclgg6sokpSFIQiZ02Q==} - - fastq@1.20.1: - resolution: {integrity: sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==} - - fdir@6.5.0: - resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==} - engines: {node: '>=12.0.0'} - peerDependencies: - picomatch: ^3 || ^4 - peerDependenciesMeta: - picomatch: - optional: true - - fetch-blob@3.2.0: - resolution: {integrity: sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==} - engines: {node: ^12.20 || >= 14.13} - - figures@6.1.0: - resolution: {integrity: sha512-d+l3qxjSesT4V7v2fh+QnmFnUWv9lSpjarhShNTgBOfA0ttejbQUAlHLitbjkoRiDulW0OPoQPYIGhIC8ohejg==} - engines: {node: '>=18'} - - fill-range@7.1.1: - resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==} - engines: {node: '>=8'} - - finalhandler@2.1.1: - resolution: {integrity: sha512-S8KoZgRZN+a5rNwqTxlZZePjT/4cnm0ROV70LedRHZ0p8u9fRID0hJUZQpkKLzro8LfmC8sx23bY6tVNxv8pQA==} - engines: {node: '>= 18.0.0'} - - formdata-polyfill@4.0.10: - resolution: {integrity: sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==} - engines: {node: '>=12.20.0'} - - forwarded@0.2.0: - resolution: {integrity: sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==} - engines: {node: '>= 0.6'} - - fresh@2.0.0: - resolution: {integrity: sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==} - engines: {node: '>= 0.8'} - - fs-extra@11.3.5: - resolution: {integrity: sha512-eKpRKAovdpZtR1WopLHxlBWvAgPny3c4gX1G5Jhwmmw4XJj0ifSD5qB5TOo8hmA0wlRKDAOAhEE1yVPgs6Fgcg==} - engines: {node: '>=14.14'} - - function-bind@1.1.2: - resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==} - - fuzzysort@3.1.0: - resolution: {integrity: sha512-sR9BNCjBg6LNgwvxlBd0sBABvQitkLzoVY9MYYROQVX/FvfJ4Mai9LsGhDgd8qYdds0bY77VzYd5iuB+v5rwQQ==} - - gensync@1.0.0-beta.2: - resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} - engines: {node: '>=6.9.0'} - - get-caller-file@2.0.5: - resolution: {integrity: sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==} - engines: {node: 6.* || 8.* || >= 10.*} - - get-east-asian-width@1.6.0: - resolution: {integrity: sha512-QRbvDIbx6YklUe6RxeTeleMR0yv3cYH6PsPZHcnVn7xv7zO1BHN8r0XETu8n6Ye3Q+ahtSarc3WgtNWmehIBfA==} - engines: {node: '>=18'} - - get-intrinsic@1.3.0: - resolution: {integrity: sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==} - engines: {node: '>= 0.4'} - - get-own-enumerable-keys@1.0.0: - resolution: {integrity: sha512-PKsK2FSrQCyxcGHsGrLDcK0lx+0Ke+6e8KFFozA9/fIQLhQzPaRvJFdcz7+Axg3jUH/Mq+NI4xa5u/UT2tQskA==} - engines: {node: '>=14.16'} - - get-proto@1.0.1: - resolution: {integrity: sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==} - engines: {node: '>= 0.4'} - - get-stream@6.0.1: - resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==} - engines: {node: '>=10'} - - get-stream@9.0.1: - resolution: {integrity: sha512-kVCxPF3vQM/N0B1PmoqVUqgHP+EeVjmZSQn+1oCRPxd2P21P2F19lIgbR3HBosbB1PUhOAoctJnfEn2GbN2eZA==} - engines: {node: '>=18'} - - glob-parent@5.1.2: - resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==} - engines: {node: '>= 6'} - - gopd@1.2.0: - resolution: {integrity: sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==} - engines: {node: '>= 0.4'} - - graceful-fs@4.2.11: - resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==} - - graphql@16.14.0: - resolution: {integrity: sha512-BBvQ/406p+4CZbTpCbVPSxfzrZrbnuWSP1ELYgyS6B+hNeKzgrdB4JczCa5VZUBQrDa9hUngm0KnexY6pJRN5Q==} - engines: {node: ^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0} - - has-symbols@1.1.0: - resolution: {integrity: sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==} - engines: {node: '>= 0.4'} - - hasown@2.0.4: - resolution: {integrity: sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==} - engines: {node: '>= 0.4'} - - headers-polyfill@5.0.1: - resolution: {integrity: sha512-1TJ6Fih/b8h5TIcv+1+Hw0PDQWJTKDKzFZzcKOiW1wJza3XoAQlkCuXLbymPYB8+ZQyw8mHvdw560e8zVFIWyA==} - - hono@4.12.25: - resolution: {integrity: sha512-2NFaIyNVgJmBs/ecmtGzlmluTFs5cHEWGTdu0t1HBwYzoGXOL5nUQBRMXsXWla5i4KkG//QMzVP88m1+I3fdAQ==} - engines: {node: '>=16.9.0'} - - http-errors@2.0.1: - resolution: {integrity: sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==} - engines: {node: '>= 0.8'} - - https-proxy-agent@7.0.6: - resolution: {integrity: sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==} - engines: {node: '>= 14'} - - human-signals@2.1.0: - resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==} - engines: {node: '>=10.17.0'} - - human-signals@8.0.1: - resolution: {integrity: sha512-eKCa6bwnJhvxj14kZk5NCPc6Hb6BdsU9DZcOnmQKSnO1VKrfV0zCvtttPZUsBvjmNDn8rpcJfpwSYnHBjc95MQ==} - engines: {node: '>=18.18.0'} - - iconv-lite@0.7.2: - resolution: {integrity: sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==} - engines: {node: '>=0.10.0'} - - ignore@5.3.2: - resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==} - engines: {node: '>= 4'} - - import-fresh@3.3.1: - resolution: {integrity: sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==} - engines: {node: '>=6'} - - inherits@2.0.4: - resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==} - - ip-address@10.2.0: - resolution: {integrity: sha512-/+S6j4E9AHvW9SWMSEY9Xfy66O5PWvVEJ08O0y5JGyEKQpojb0K0GKpz/v5HJ/G0vi3D2sjGK78119oXZeE0qA==} - engines: {node: '>= 12'} - - ipaddr.js@1.9.1: - resolution: {integrity: sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==} - engines: {node: '>= 0.10'} - - is-arrayish@0.2.1: - resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==} - - is-docker@3.0.0: - resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==} - engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} - hasBin: true - - is-extglob@2.1.1: - resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==} - engines: {node: '>=0.10.0'} - - is-fullwidth-code-point@3.0.0: - resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==} - engines: {node: '>=8'} - - is-glob@4.0.3: - resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==} - engines: {node: '>=0.10.0'} - - is-in-ssh@1.0.0: - resolution: {integrity: sha512-jYa6Q9rH90kR1vKB6NM7qqd1mge3Fx4Dhw5TVlK1MUBqhEOuCagrEHMevNuCcbECmXZ0ThXkRm+Ymr51HwEPAw==} - engines: {node: '>=20'} - - is-inside-container@1.0.0: - resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==} - engines: {node: '>=14.16'} - hasBin: true - - is-interactive@2.0.0: - resolution: {integrity: sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==} - engines: {node: '>=12'} - - is-node-process@1.2.0: - resolution: {integrity: sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw==} - - is-number@7.0.0: - resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==} - engines: {node: '>=0.12.0'} - - is-obj@3.0.0: - resolution: {integrity: sha512-IlsXEHOjtKhpN8r/tRFj2nDyTmHvcfNeu/nrRIcXE17ROeatXchkojffa1SpdqW4cr/Fj6QkEf/Gn4zf6KKvEQ==} - engines: {node: '>=12'} - - is-plain-obj@4.1.0: - resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==} - engines: {node: '>=12'} - - is-promise@4.0.0: - resolution: {integrity: sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==} - - is-regexp@3.1.0: - resolution: {integrity: sha512-rbku49cWloU5bSMI+zaRaXdQHXnthP6DZ/vLnfdSKyL4zUzuWnomtOEiZZOd+ioQ+avFo/qau3KPTc7Fjy1uPA==} - engines: {node: '>=12'} - - is-stream@2.0.1: - resolution: {integrity: sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==} - engines: {node: '>=8'} - - is-stream@4.0.1: - resolution: {integrity: sha512-Dnz92NInDqYckGEUJv689RbRiTSEHCQ7wOVeALbkOz999YpqT46yMRIGtSNl2iCL1waAZSx40+h59NV/EwzV/A==} - engines: {node: '>=18'} - - is-unicode-supported@1.3.0: - resolution: {integrity: sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==} - engines: {node: '>=12'} - - is-unicode-supported@2.1.0: - resolution: {integrity: sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==} - engines: {node: '>=18'} - - is-wsl@3.1.1: - resolution: {integrity: sha512-e6rvdUCiQCAuumZslxRJWR/Doq4VpPR82kqclvcS0efgt430SlGIk05vdCN58+VrzgtIcfNODjozVielycD4Sw==} - engines: {node: '>=16'} - - isexe@2.0.0: - resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==} - - isexe@3.1.5: - resolution: {integrity: sha512-6B3tLtFqtQS4ekarvLVMZ+X+VlvQekbe4taUkf/rhVO3d/h0M2rfARm/pXLcPEsjjMsFgrFgSrhQIxcSVrBz8w==} - engines: {node: '>=18'} - - jiti@2.7.0: - resolution: {integrity: sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==} - hasBin: true - - jose@6.2.3: - resolution: {integrity: sha512-YYVDInQKFJfR/xa3ojUTl8c2KoTwiL1R5Wg9YCydwH0x0B9grbzlg5HC7mMjCtUJjbQ/YnGEZIhI5tCgfTb4Hw==} - - js-tokens@4.0.0: - resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==} - - js-yaml@4.2.0: - resolution: {integrity: sha512-ePWsvanv0DWuDRsW8dnt+R4jQ31SCRCQ7hhNcPXZPsoBZiemuZNYGf7adZdqX2D86j6rvKp3RpCxVTSb8WQlOw==} - hasBin: true - - jsesc@3.1.0: - resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==} - engines: {node: '>=6'} - hasBin: true - - json-parse-even-better-errors@2.3.1: - resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==} - - json-schema-traverse@1.0.0: - resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==} - - json-schema-typed@8.0.2: - resolution: {integrity: sha512-fQhoXdcvc3V28x7C7BMs4P5+kNlgUURe2jmUT1T//oBRMDrqy1QPelJimwZGo7Hg9VPV3EQV5Bnq4hbFy2vetA==} - - json5@2.2.3: - resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==} - engines: {node: '>=6'} - hasBin: true - - jsonfile@6.2.1: - resolution: {integrity: sha512-zwOTdL3rFQ/lRdBnntKVOX6k5cKJwEc1HdilT71BWEu7J41gXIB2MRp+vxduPSwZJPWBxEzv4yH1wYLJGUHX4Q==} - - kleur@3.0.3: - resolution: {integrity: sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==} - engines: {node: '>=6'} - - kleur@4.1.5: - resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==} - engines: {node: '>=6'} - - lightningcss-android-arm64@1.32.0: - resolution: {integrity: sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==} - engines: {node: '>= 12.0.0'} - cpu: [arm64] - os: [android] - - lightningcss-darwin-arm64@1.32.0: - resolution: {integrity: sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==} - engines: {node: '>= 12.0.0'} - cpu: [arm64] - os: [darwin] - - lightningcss-darwin-x64@1.32.0: - resolution: {integrity: sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==} - engines: {node: '>= 12.0.0'} - cpu: [x64] - os: [darwin] - - lightningcss-freebsd-x64@1.32.0: - resolution: {integrity: sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==} - engines: {node: '>= 12.0.0'} - cpu: [x64] - os: [freebsd] - - lightningcss-linux-arm-gnueabihf@1.32.0: - resolution: {integrity: sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==} - engines: {node: '>= 12.0.0'} - cpu: [arm] - os: [linux] - - lightningcss-linux-arm64-gnu@1.32.0: - resolution: {integrity: sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==} - engines: {node: '>= 12.0.0'} - cpu: [arm64] - os: [linux] - libc: [glibc] - - lightningcss-linux-arm64-musl@1.32.0: - resolution: {integrity: sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==} - engines: {node: '>= 12.0.0'} - cpu: [arm64] - os: [linux] - libc: [musl] - - lightningcss-linux-x64-gnu@1.32.0: - resolution: {integrity: sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==} - engines: {node: '>= 12.0.0'} - cpu: [x64] - os: [linux] - libc: [glibc] - - lightningcss-linux-x64-musl@1.32.0: - resolution: {integrity: sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==} - engines: {node: '>= 12.0.0'} - cpu: [x64] - os: [linux] - libc: [musl] - - lightningcss-win32-arm64-msvc@1.32.0: - resolution: {integrity: sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==} - engines: {node: '>= 12.0.0'} - cpu: [arm64] - os: [win32] - - lightningcss-win32-x64-msvc@1.32.0: - resolution: {integrity: sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==} - engines: {node: '>= 12.0.0'} - cpu: [x64] - os: [win32] - - lightningcss@1.32.0: - resolution: {integrity: sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==} - engines: {node: '>= 12.0.0'} - - lines-and-columns@1.2.4: - resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==} - - log-symbols@6.0.0: - resolution: {integrity: sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==} - engines: {node: '>=18'} - - lru-cache@5.1.1: - resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} - - lucide-react@1.17.0: - resolution: {integrity: sha512-9FA9evdox/JQL5PT57fdA1x/yg8T7knJ98+zjTL3UfKza6pflQUUh3XtaQIHKvnsJw1lmsEyHVlt5jchYxOQ5w==} - peerDependencies: - react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0 - - magic-string@0.30.21: - resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==} - - math-intrinsics@1.1.0: - resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==} - engines: {node: '>= 0.4'} - - media-typer@1.1.0: - resolution: {integrity: sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==} - engines: {node: '>= 0.8'} - - merge-descriptors@2.0.0: - resolution: {integrity: sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==} - engines: {node: '>=18'} - - merge-stream@2.0.0: - resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==} - - merge2@1.4.1: - resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==} - engines: {node: '>= 8'} - - micromatch@4.0.8: - resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==} - engines: {node: '>=8.6'} - - mime-db@1.54.0: - resolution: {integrity: sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==} - engines: {node: '>= 0.6'} - - mime-types@3.0.2: - resolution: {integrity: sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==} - engines: {node: '>=18'} - - mimic-fn@2.1.0: - resolution: {integrity: sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==} - engines: {node: '>=6'} - - mimic-function@5.0.1: - resolution: {integrity: sha512-VP79XUPxV2CigYP3jWwAUFSku2aKqBH7uTAapFWCBqutsbmDo96KY5o8uh6U+/YSIn5OxJnXp73beVkpqMIGhA==} - engines: {node: '>=18'} - - minimatch@10.2.5: - resolution: {integrity: sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==} - engines: {node: 18 || 20 || >=22} - - minimist@1.2.8: - resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==} - - ms@2.1.3: - resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} - - msw@2.14.6: - resolution: {integrity: sha512-ALe+N10S72cyx94cMcy3Zs4HhXCj35sgeAL4c+WTvKi0zWnbd8/h0lcFqv0mb2P+aSgAdD7p9HzvA0DiUPxsyg==} - engines: {node: '>=18'} - hasBin: true - peerDependencies: - typescript: '>= 4.8.x' - peerDependenciesMeta: - typescript: - optional: true - - mute-stream@3.0.0: - resolution: {integrity: sha512-dkEJPVvun4FryqBmZ5KhDo0K9iDXAwn08tMLDinNdRBNPcYEDiWYysLcc6k3mjTMlbP9KyylvRpd4wFtwrT9rw==} - engines: {node: ^20.17.0 || >=22.9.0} - - nanoid@3.3.11: - resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==} - engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} - hasBin: true - - nanoid@3.3.16: - resolution: {integrity: sha512-bzlKTyNJ7+LdGIIwy8ijFpIqEQIvafahV7eYykJ8Cvh42EdJeODoJ6gUJXpQJvej1BddH8OqTXZNE/KfbWAu8Q==} - engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} - hasBin: true - - negotiator@1.0.0: - resolution: {integrity: sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==} - engines: {node: '>= 0.6'} - - next@16.3.0: - resolution: {integrity: sha512-NEdGOzH+08eTXMUp9UYkA99Nhi5N6Thrhc1jgFOQgfgnGK/dA2hRwBpXep+exdFQrnwlRf/3Wixyp8lLBUpE2A==} - engines: {node: '>=20.9.0'} - hasBin: true - peerDependencies: - '@opentelemetry/api': ^1.1.0 - '@playwright/test': ^1.51.1 - babel-plugin-react-compiler: '*' - react: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0 - react-dom: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0 - sass: ^1.3.0 - peerDependenciesMeta: - '@opentelemetry/api': - optional: true - '@playwright/test': - optional: true - babel-plugin-react-compiler: - optional: true - sass: - optional: true - - node-domexception@1.0.0: - resolution: {integrity: sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==} - engines: {node: '>=10.5.0'} - deprecated: Use your platform's native DOMException instead - - node-fetch@3.3.2: - resolution: {integrity: sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==} - engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} - - node-releases@2.0.27: - resolution: {integrity: sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA==} - - npm-run-path@4.0.1: - resolution: {integrity: sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==} - engines: {node: '>=8'} - - npm-run-path@6.0.0: - resolution: {integrity: sha512-9qny7Z9DsQU8Ou39ERsPU4OZQlSTP47ShQzuKZ6PRXpYLtIFgl/DEBYEXKlvcEa+9tHVcK8CF81Y2V72qaZhWA==} - engines: {node: '>=18'} - - object-assign@4.1.1: - resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==} - engines: {node: '>=0.10.0'} - - object-inspect@1.13.4: - resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==} - engines: {node: '>= 0.4'} - - object-treeify@1.1.33: - resolution: {integrity: sha512-EFVjAYfzWqWsBMRHPMAXLCDIJnpMhdWAqR7xG6M6a2cs6PMFpl/+Z20w9zDW4vkxOFfddegBKq9Rehd0bxWE7A==} - engines: {node: '>= 10'} - - on-finished@2.4.1: - resolution: {integrity: sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==} - engines: {node: '>= 0.8'} - - once@1.4.0: - resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==} - - onetime@5.1.2: - resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==} - engines: {node: '>=6'} - - onetime@7.0.0: - resolution: {integrity: sha512-VXJjc87FScF88uafS3JllDgvAm+c/Slfz06lorj2uAY34rlUu0Nt+v8wreiImcrgAjjIHp1rXpTDlLOGw29WwQ==} - engines: {node: '>=18'} - - open@11.0.0: - resolution: {integrity: sha512-smsWv2LzFjP03xmvFoJ331ss6h+jixfA4UUV/Bsiyuu4YJPfN+FIQGOIiv4w9/+MoHkfkJ22UIaQWRVFRfH6Vw==} - engines: {node: '>=20'} - - ora@8.2.0: - resolution: {integrity: sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==} - engines: {node: '>=18'} - - outvariant@1.4.3: - resolution: {integrity: sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==} - - parent-module@1.0.1: - resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==} - engines: {node: '>=6'} - - parse-json@5.2.0: - resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==} - engines: {node: '>=8'} - - parse-ms@4.0.0: - resolution: {integrity: sha512-TXfryirbmq34y8QBwgqCVLi+8oA3oWx2eAnSn62ITyEhEYaWRlVZ2DvMM9eZbMs/RfxPu/PK/aBLyGj4IrqMHw==} - engines: {node: '>=18'} - - parseurl@1.3.3: - resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==} - engines: {node: '>= 0.8'} - - path-browserify@1.0.1: - resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==} - - path-key@3.1.1: - resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==} - engines: {node: '>=8'} - - path-key@4.0.0: - resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==} - engines: {node: '>=12'} - - path-to-regexp@6.3.0: - resolution: {integrity: sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==} - - path-to-regexp@8.4.2: - resolution: {integrity: sha512-qRcuIdP69NPm4qbACK+aDogI5CBDMi1jKe0ry5rSQJz8JVLsC7jV8XpiJjGRLLol3N+R5ihGYcrPLTno6pAdBA==} - - picocolors@1.1.1: - resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} - - picomatch@2.3.2: - resolution: {integrity: sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==} - engines: {node: '>=8.6'} - - picomatch@4.0.4: - resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==} - engines: {node: '>=12'} - - pkce-challenge@5.0.1: - resolution: {integrity: sha512-wQ0b/W4Fr01qtpHlqSqspcj3EhBvimsdh0KlHhH8HRZnMsEa0ea2fTULOXOS9ccQr3om+GcGRk4e+isrZWV8qQ==} - engines: {node: '>=16.20.0'} - - postcss-selector-parser@7.1.1: - resolution: {integrity: sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==} - engines: {node: '>=4'} - - postcss@8.5.19: - resolution: {integrity: sha512-Mz8SaolMd8nB+G13WkORcxQKHZ/NE4xXevtkJHVuG+guo9/wYKlIMTKAqGdEmYOXR2ijPjTYNHssizdaVSUNdQ==} - engines: {node: ^10 || ^12 || >=14} - - postcss@8.5.23: - resolution: {integrity: sha512-g50586zr4bZmwFiTlflMu8E0bDTb5I5gertgwAKmsdUlTQIhZtunzUlD1WSzwcVWPoAVpsrA6vlfCD7oXvRwgg==} - engines: {node: ^10 || ^12 || >=14} - - postcss@8.5.6: - resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==} - engines: {node: ^10 || ^12 || >=14} - - powershell-utils@0.1.0: - resolution: {integrity: sha512-dM0jVuXJPsDN6DvRpea484tCUaMiXWjuCn++HGTqUWzGDjv5tZkEZldAJ/UMlqRYGFrD/etByo4/xOuC/snX2A==} - engines: {node: '>=20'} - - pretty-ms@9.3.0: - resolution: {integrity: sha512-gjVS5hOP+M3wMm5nmNOucbIrqudzs9v/57bWRHQWLYklXqoXKrVfYW2W9+glfGsqtPgpiz5WwyEEB+ksXIx3gQ==} - engines: {node: '>=18'} - - prompts@2.4.2: - resolution: {integrity: sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==} - engines: {node: '>= 6'} - - proxy-addr@2.0.7: - resolution: {integrity: sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==} - engines: {node: '>= 0.10'} - - qs@6.15.2: - resolution: {integrity: sha512-Rzq0KEyX/w/tEybncDgdkZrJgVUsUMk3xjh3t5bv3S1HTAtg+uOYt72+ZfwiQwKdysThkTBdL/rTi6HDmX9Ddw==} - engines: {node: '>=0.6'} - - queue-microtask@1.2.3: - resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==} - - range-parser@1.2.1: - resolution: {integrity: sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==} - engines: {node: '>= 0.6'} - - raw-body@3.0.2: - resolution: {integrity: sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA==} - engines: {node: '>= 0.10'} - - react-dom@19.2.4: - resolution: {integrity: sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==} - peerDependencies: - react: ^19.2.4 - - react@19.2.4: - resolution: {integrity: sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==} - engines: {node: '>=0.10.0'} - - recast@0.23.11: - resolution: {integrity: sha512-YTUo+Flmw4ZXiWfQKGcwwc11KnoRAYgzAE2E7mXKCjSviTKShtxBsN6YUUBB2gtaBzKzeKunxhUwNHQuRryhWA==} - engines: {node: '>= 4'} - - require-directory@2.1.1: - resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==} - engines: {node: '>=0.10.0'} - - require-from-string@2.0.2: - resolution: {integrity: sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==} - engines: {node: '>=0.10.0'} - - reselect@5.2.0: - resolution: {integrity: sha512-AgZ3UOZm3YndfrJ4OYjgrT7bmCm/1iqkjvEfH/oYjzh6PD2qw4QuT3jjnXIrpdt4MTpMXclMT3lXbmRY+XRakw==} - - resolve-from@4.0.0: - resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==} - engines: {node: '>=4'} - - restore-cursor@5.1.0: - resolution: {integrity: sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==} - engines: {node: '>=18'} - - rettime@0.11.11: - resolution: {integrity: sha512-ILJRqVWBCTlg9r42fFgwVZx1gnFAcQF8mRoMkbgQfIrjEDf9nbBFDFx00oloOa+Q869FUtaYDXZvEfnecQSCoQ==} - - reusify@1.1.0: - resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==} - engines: {iojs: '>=1.0.0', node: '>=0.10.0'} - - router@2.2.0: - resolution: {integrity: sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==} - engines: {node: '>= 18'} - - run-applescript@7.1.0: - resolution: {integrity: sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==} - engines: {node: '>=18'} - - run-parallel@1.2.0: - resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==} - - safer-buffer@2.1.2: - resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} - - scheduler@0.27.0: - resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==} - - semver@6.3.1: - resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==} - hasBin: true - - semver@7.8.5: - resolution: {integrity: sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==} - engines: {node: '>=10'} - hasBin: true - - send@1.2.1: - resolution: {integrity: sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==} - engines: {node: '>= 18'} - - serve-static@2.2.1: - resolution: {integrity: sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==} - engines: {node: '>= 18'} - - set-cookie-parser@3.1.0: - resolution: {integrity: sha512-kjnC1DXBHcxaOaOXBHBeRtltsDG2nUiUni+jP92M9gYdW12rsmx92UsfpH7o5tDRs7I1ZZPSQJQGv3UaRfCiuw==} - - setprototypeof@1.2.0: - resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==} - - shadcn@4.10.0: - resolution: {integrity: sha512-84IJhUsK0xqSCRJx3QxyZe2NpUXj2Nwk8Vc8Ow/tCOND3yz4CT6uU4655vqicNXhzG9Q1cyUt+TBl2SiCJwNgg==} - hasBin: true - - sharp@0.35.3: - resolution: {integrity: sha512-ej0zVHuZGHCiABXcNxeYhpRnPNPAcvbG8RMdBAhDAxLKkCRVSpK3Iyu7qbqw3JMzoj0REeM6f3tJLtVwl0023Q==} - engines: {node: '>=20.9.0'} - peerDependencies: - '@types/node': '*' - peerDependenciesMeta: - '@types/node': - optional: true - - shebang-command@2.0.0: - resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==} - engines: {node: '>=8'} - - shebang-regex@3.0.0: - resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==} - engines: {node: '>=8'} - - side-channel-list@1.0.1: - resolution: {integrity: sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==} - engines: {node: '>= 0.4'} - - side-channel-map@1.0.1: - resolution: {integrity: sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==} - engines: {node: '>= 0.4'} - - side-channel-weakmap@1.0.2: - resolution: {integrity: sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==} - engines: {node: '>= 0.4'} - - side-channel@1.1.0: - resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==} - engines: {node: '>= 0.4'} - - signal-exit@3.0.7: - resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==} - - signal-exit@4.1.0: - resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==} - engines: {node: '>=14'} - - sisteransi@1.0.5: - resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} - - source-map-js@1.2.1: - resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==} - engines: {node: '>=0.10.0'} - - source-map@0.6.1: - resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==} - engines: {node: '>=0.10.0'} - - statuses@2.0.2: - resolution: {integrity: sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==} - engines: {node: '>= 0.8'} - - stdin-discarder@0.2.2: - resolution: {integrity: sha512-UhDfHmA92YAlNnCfhmq0VeNL5bDbiZGg7sZ2IvPsXubGkiNa9EC+tUTsjBRsYUAz87btI6/1wf4XoVvQ3uRnmQ==} - engines: {node: '>=18'} - - strict-event-emitter@0.5.1: - resolution: {integrity: sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ==} - - string-width@4.2.3: - resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==} - engines: {node: '>=8'} - - string-width@7.2.0: - resolution: {integrity: sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==} - engines: {node: '>=18'} - - stringify-object@5.0.0: - resolution: {integrity: sha512-zaJYxz2FtcMb4f+g60KsRNFOpVMUyuJgA51Zi5Z1DOTC3S59+OQiVOzE9GZt0x72uBGWKsQIuBKeF9iusmKFsg==} - engines: {node: '>=14.16'} - - strip-ansi@6.0.1: - resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==} - engines: {node: '>=8'} - - strip-ansi@7.2.0: - resolution: {integrity: sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==} - engines: {node: '>=12'} - - strip-bom@3.0.0: - resolution: {integrity: sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==} - engines: {node: '>=4'} - - strip-final-newline@2.0.0: - resolution: {integrity: sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==} - engines: {node: '>=6'} - - strip-final-newline@4.0.0: - resolution: {integrity: sha512-aulFJcD6YK8V1G7iRB5tigAP4TsHBZZrOV8pjV++zdUwmeV8uzbY7yn6h9MswN62adStNZFuCIx4haBnRuMDaw==} - engines: {node: '>=18'} - - styled-jsx@5.1.6: - resolution: {integrity: sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==} - engines: {node: '>= 12.0.0'} - peerDependencies: - '@babel/core': '*' - babel-plugin-macros: '*' - react: '>= 16.8.0 || 17.x.x || ^18.0.0-0 || ^19.0.0-0' - peerDependenciesMeta: - '@babel/core': - optional: true - babel-plugin-macros: - optional: true - - tagged-tag@1.0.0: - resolution: {integrity: sha512-yEFYrVhod+hdNyx7g5Bnkkb0G6si8HJurOoOEgC8B/O0uXLHlaey/65KRv6cuWBNhBgHKAROVpc7QyYqE5gFng==} - engines: {node: '>=20'} - - tailwind-merge@3.4.0: - resolution: {integrity: sha512-uSaO4gnW+b3Y2aWoWfFpX62vn2sR3skfhbjsEnaBI81WD1wBLlHZe5sWf0AqjksNdYTbGBEd0UasQMT3SNV15g==} - - tailwindcss@4.3.3: - resolution: {integrity: sha512-gOhV3P7ufE62QDGg1zVaTgCR+EtPv92k2nIhVcVKcLmxT1sUBsQGhnZj175j+MqRt4zLF7ic+sCYjfhxMxj7YQ==} - - tapable@2.3.3: - resolution: {integrity: sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==} - engines: {node: '>=6'} - - tiny-invariant@1.3.3: - resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==} - - tldts-core@7.4.2: - resolution: {integrity: sha512-nwEyF4vl4RSJjwSjBUmOSxc3BFPoIFdlRthJ6e+5v9P3bHNsoD06UjuqMUspqp7vsEZ1beaHi1km+optiE17yA==} - - tldts@7.4.2: - resolution: {integrity: sha512-kCwffuaH8ntKtygnWe1b4BJKWiCUH30n5KfoTr6IchcXOwR7chAOFJxFrH3vjANafUYrIA4a7SDL+nn7SiR4Sw==} - hasBin: true - - to-regex-range@5.0.1: - resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==} - engines: {node: '>=8.0'} - - toidentifier@1.0.1: - resolution: {integrity: sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==} - engines: {node: '>=0.6'} - - tough-cookie@6.0.1: - resolution: {integrity: sha512-LktZQb3IeoUWB9lqR5EWTHgW/VTITCXg4D21M+lvybRVdylLrRMnqaIONLVb5mav8vM19m44HIcGq4qASeu2Qw==} - engines: {node: '>=16'} - - ts-morph@26.0.0: - resolution: {integrity: sha512-ztMO++owQnz8c/gIENcM9XfCEzgoGphTv+nKpYNM1bgsdOVC/jRZuEBf6N+mLLDNg68Kl+GgUZfOySaRiG1/Ug==} - - tsconfig-paths@4.2.0: - resolution: {integrity: sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==} - engines: {node: '>=6'} - - tslib@2.8.1: - resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} - - tw-animate-css@1.4.0: - resolution: {integrity: sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ==} - - type-fest@5.7.0: - resolution: {integrity: sha512-1URUxUqfHFM1c+zfSPsa3gnkO7Aq21qyH75SIduNYz4SzY964rn1X2vCMQaHSHhktiw+0kPa2iyb6PUpXqB6Vg==} - engines: {node: '>=20'} - - type-is@2.1.0: - resolution: {integrity: sha512-faYHw0anBbc/kWF3zFTEnxSFOAGUX9GFbOBthvDdLsIlEoWOFOtS0zgCiQYwIskL9iGXZL3kAXD8OoZ4GmMATA==} - engines: {node: '>= 18'} - - typescript@5.7.3: - resolution: {integrity: sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==} - engines: {node: '>=14.17'} - hasBin: true - - undici-types@7.16.0: - resolution: {integrity: sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==} - - unicorn-magic@0.3.0: - resolution: {integrity: sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==} - engines: {node: '>=18'} - - universalify@2.0.1: - resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==} - engines: {node: '>= 10.0.0'} - - unpipe@1.0.0: - resolution: {integrity: sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==} - engines: {node: '>= 0.8'} - - until-async@3.0.2: - resolution: {integrity: sha512-IiSk4HlzAMqTUseHHe3VhIGyuFmN90zMTpD3Z3y8jeQbzLIq500MVM7Jq2vUAnTKAFPJrqwkzr6PoTcPhGcOiw==} - - update-browserslist-db@1.2.3: - resolution: {integrity: sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==} - hasBin: true - peerDependencies: - browserslist: '>= 4.21.0' - - use-sync-external-store@1.6.0: - resolution: {integrity: sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==} - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 - - util-deprecate@1.0.2: - resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} - - validate-npm-package-name@7.0.2: - resolution: {integrity: sha512-hVDIBwsRruT73PbK7uP5ebUt+ezEtCmzZz3F59BSr2F6OVFnJ/6h8liuvdLrQ88Xmnk6/+xGGuq+pG9WwTuy3A==} - engines: {node: ^20.17.0 || >=22.9.0} - - vary@1.1.2: - resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==} - engines: {node: '>= 0.8'} - - web-streams-polyfill@3.3.3: - resolution: {integrity: sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==} - engines: {node: '>= 8'} - - which@2.0.2: - resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==} - engines: {node: '>= 8'} - hasBin: true - - which@4.0.0: - resolution: {integrity: sha512-GlaYyEb07DPxYCKhKzplCWBJtvxZcZMrL+4UkrTSJHHPyZU4mYYTv3qaOe77H7EODLSSopAUFAc6W8U4yqvscg==} - engines: {node: ^16.13.0 || >=18.0.0} - hasBin: true - - wrap-ansi@7.0.0: - resolution: {integrity: sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==} - engines: {node: '>=10'} - - wrappy@1.0.2: - resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==} - - wsl-utils@0.3.1: - resolution: {integrity: sha512-g/eziiSUNBSsdDJtCLB8bdYEUMj4jR7AGeUo96p/3dTafgjHhpF4RiCFPiRILwjQoDXx5MqkBr4fwWtR3Ky4Wg==} - engines: {node: '>=20'} - - y18n@5.0.8: - resolution: {integrity: sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==} - engines: {node: '>=10'} - - yallist@3.1.1: - resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} - - yargs-parser@21.1.1: - resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==} - engines: {node: '>=12'} - - yargs@17.7.2: - resolution: {integrity: sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==} - engines: {node: '>=12'} - - yocto-spinner@1.2.0: - resolution: {integrity: sha512-Yw0hUB6UA3o4YUgKy3oSe9a4cxoaZ9sBfYDw+JSxo6Id0KoJGoxzPA24qqUXYKBWABs/zDSGTz9kww7t3F0XGw==} - engines: {node: '>=18.19'} - - yoctocolors@2.1.2: - resolution: {integrity: sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==} - engines: {node: '>=18'} - - zod-to-json-schema@3.25.2: - resolution: {integrity: sha512-O/PgfnpT1xKSDeQYSCfRI5Gy3hPf91mKVDuYLUHZJMiDFptvP41MSnWofm8dnCm0256ZNfZIM7DSzuSMAFnjHA==} - peerDependencies: - zod: ^3.25.28 || ^4 - - zod@3.25.76: - resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==} - -snapshots: - - '@alloc/quick-lru@5.2.0': {} - - '@babel/code-frame@7.29.7': - dependencies: - '@babel/helper-validator-identifier': 7.29.7 - js-tokens: 4.0.0 - picocolors: 1.1.1 - - '@babel/compat-data@7.29.7': {} - - '@babel/core@7.29.7': - dependencies: - '@babel/code-frame': 7.29.7 - '@babel/generator': 7.29.7 - '@babel/helper-compilation-targets': 7.29.7 - '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7) - '@babel/helpers': 7.29.7 - '@babel/parser': 7.29.7 - '@babel/template': 7.29.7 - '@babel/traverse': 7.29.7 - '@babel/types': 7.29.7 - '@jridgewell/remapping': 2.3.5 - convert-source-map: 2.0.0 - debug: 4.4.3 - gensync: 1.0.0-beta.2 - json5: 2.2.3 - semver: 6.3.1 - transitivePeerDependencies: - - supports-color - - '@babel/generator@7.29.7': - dependencies: - '@babel/parser': 7.29.7 - '@babel/types': 7.29.7 - '@jridgewell/gen-mapping': 0.3.13 - '@jridgewell/trace-mapping': 0.3.31 - jsesc: 3.1.0 - - '@babel/helper-annotate-as-pure@7.29.7': - dependencies: - '@babel/types': 7.29.7 - - '@babel/helper-compilation-targets@7.29.7': - dependencies: - '@babel/compat-data': 7.29.7 - '@babel/helper-validator-option': 7.29.7 - browserslist: 4.28.1 - lru-cache: 5.1.1 - semver: 6.3.1 - - '@babel/helper-create-class-features-plugin@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-annotate-as-pure': 7.29.7 - '@babel/helper-member-expression-to-functions': 7.29.7 - '@babel/helper-optimise-call-expression': 7.29.7 - '@babel/helper-replace-supers': 7.29.7(@babel/core@7.29.7) - '@babel/helper-skip-transparent-expression-wrappers': 7.29.7 - '@babel/traverse': 7.29.7 - semver: 6.3.1 - transitivePeerDependencies: - - supports-color - - '@babel/helper-globals@7.29.7': {} - - '@babel/helper-member-expression-to-functions@7.29.7': - dependencies: - '@babel/traverse': 7.29.7 - '@babel/types': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/helper-module-imports@7.29.7': - dependencies: - '@babel/traverse': 7.29.7 - '@babel/types': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/helper-module-transforms@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-module-imports': 7.29.7 - '@babel/helper-validator-identifier': 7.29.7 - '@babel/traverse': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/helper-optimise-call-expression@7.29.7': - dependencies: - '@babel/types': 7.29.7 - - '@babel/helper-plugin-utils@7.29.7': {} - - '@babel/helper-replace-supers@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-member-expression-to-functions': 7.29.7 - '@babel/helper-optimise-call-expression': 7.29.7 - '@babel/traverse': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/helper-skip-transparent-expression-wrappers@7.29.7': - dependencies: - '@babel/traverse': 7.29.7 - '@babel/types': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/helper-string-parser@7.29.7': {} - - '@babel/helper-validator-identifier@7.29.7': {} - - '@babel/helper-validator-option@7.29.7': {} - - '@babel/helpers@7.29.7': - dependencies: - '@babel/template': 7.29.7 - '@babel/types': 7.29.7 - - '@babel/parser@7.29.7': - dependencies: - '@babel/types': 7.29.7 - - '@babel/plugin-syntax-jsx@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-plugin-utils': 7.29.7 - - '@babel/plugin-syntax-typescript@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-plugin-utils': 7.29.7 - - '@babel/plugin-transform-modules-commonjs@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7) - '@babel/helper-plugin-utils': 7.29.7 - transitivePeerDependencies: - - supports-color - - '@babel/plugin-transform-typescript@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-annotate-as-pure': 7.29.7 - '@babel/helper-create-class-features-plugin': 7.29.7(@babel/core@7.29.7) - '@babel/helper-plugin-utils': 7.29.7 - '@babel/helper-skip-transparent-expression-wrappers': 7.29.7 - '@babel/plugin-syntax-typescript': 7.29.7(@babel/core@7.29.7) - transitivePeerDependencies: - - supports-color - - '@babel/preset-typescript@7.29.7(@babel/core@7.29.7)': - dependencies: - '@babel/core': 7.29.7 - '@babel/helper-plugin-utils': 7.29.7 - '@babel/helper-validator-option': 7.29.7 - '@babel/plugin-syntax-jsx': 7.29.7(@babel/core@7.29.7) - '@babel/plugin-transform-modules-commonjs': 7.29.7(@babel/core@7.29.7) - '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7) - transitivePeerDependencies: - - supports-color - - '@babel/runtime@7.29.7': {} - - '@babel/template@7.29.7': - dependencies: - '@babel/code-frame': 7.29.7 - '@babel/parser': 7.29.7 - '@babel/types': 7.29.7 - - '@babel/traverse@7.29.7': - dependencies: - '@babel/code-frame': 7.29.7 - '@babel/generator': 7.29.7 - '@babel/helper-globals': 7.29.7 - '@babel/parser': 7.29.7 - '@babel/template': 7.29.7 - '@babel/types': 7.29.7 - debug: 4.4.3 - transitivePeerDependencies: - - supports-color - - '@babel/types@7.29.7': - dependencies: - '@babel/helper-string-parser': 7.29.7 - '@babel/helper-validator-identifier': 7.29.7 - - '@base-ui/react@1.5.0(@date-fns/tz@1.4.1)(@types/react@19.2.14)(date-fns@4.1.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': - dependencies: - '@babel/runtime': 7.29.7 - '@base-ui/utils': 0.2.9(@types/react@19.2.14)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - '@floating-ui/react-dom': 2.1.8(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - '@floating-ui/utils': 0.2.11 - react: 19.2.4 - react-dom: 19.2.4(react@19.2.4) - use-sync-external-store: 1.6.0(react@19.2.4) - optionalDependencies: - '@date-fns/tz': 1.4.1 - '@types/react': 19.2.14 - date-fns: 4.1.0 - - '@base-ui/utils@0.2.9(@types/react@19.2.14)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': - dependencies: - '@babel/runtime': 7.29.7 - '@floating-ui/utils': 0.2.11 - react: 19.2.4 - react-dom: 19.2.4(react@19.2.4) - reselect: 5.2.0 - use-sync-external-store: 1.6.0(react@19.2.4) - optionalDependencies: - '@types/react': 19.2.14 - - '@date-fns/tz@1.4.1': - optional: true - - '@dotenvx/dotenvx@1.70.0': - dependencies: - commander: 11.1.0 - dotenv: 17.4.2 - eciesjs: 0.4.18 - enquirer: 2.4.1 - execa: 5.1.1 - fdir: 6.5.0(picomatch@4.0.4) - ignore: 5.3.2 - object-treeify: 1.1.33 - picomatch: 4.0.4 - which: 4.0.0 - yocto-spinner: 1.2.0 - - '@ecies/ciphers@0.2.6(@noble/ciphers@1.3.0)': - dependencies: - '@noble/ciphers': 1.3.0 - - '@emnapi/runtime@1.11.3': - dependencies: - tslib: 2.8.1 - optional: true - - '@floating-ui/core@1.7.5': - dependencies: - '@floating-ui/utils': 0.2.11 - - '@floating-ui/dom@1.7.6': - dependencies: - '@floating-ui/core': 1.7.5 - '@floating-ui/utils': 0.2.11 - - '@floating-ui/react-dom@2.1.8(react-dom@19.2.4(react@19.2.4))(react@19.2.4)': - dependencies: - '@floating-ui/dom': 1.7.6 - react: 19.2.4 - react-dom: 19.2.4(react@19.2.4) - - '@floating-ui/utils@0.2.11': {} - - '@hono/node-server@1.19.14(hono@4.12.25)': - dependencies: - hono: 4.12.25 - - '@img/colour@1.1.0': - optional: true - - '@img/sharp-darwin-arm64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-darwin-arm64': 1.3.2 - optional: true - - '@img/sharp-darwin-x64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-darwin-x64': 1.3.2 - optional: true - - '@img/sharp-freebsd-wasm32@0.35.3': - dependencies: - '@img/sharp-wasm32': 0.35.3 - optional: true - - '@img/sharp-libvips-darwin-arm64@1.3.2': - optional: true - - '@img/sharp-libvips-darwin-x64@1.3.2': - optional: true - - '@img/sharp-libvips-linux-arm64@1.3.2': - optional: true - - '@img/sharp-libvips-linux-arm@1.3.2': - optional: true - - '@img/sharp-libvips-linux-ppc64@1.3.2': - optional: true - - '@img/sharp-libvips-linux-riscv64@1.3.2': - optional: true - - '@img/sharp-libvips-linux-s390x@1.3.2': - optional: true - - '@img/sharp-libvips-linux-x64@1.3.2': - optional: true - - '@img/sharp-libvips-linuxmusl-arm64@1.3.2': - optional: true - - '@img/sharp-libvips-linuxmusl-x64@1.3.2': - optional: true - - '@img/sharp-linux-arm64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-arm64': 1.3.2 - optional: true - - '@img/sharp-linux-arm@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-arm': 1.3.2 - optional: true - - '@img/sharp-linux-ppc64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-ppc64': 1.3.2 - optional: true - - '@img/sharp-linux-riscv64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-riscv64': 1.3.2 - optional: true - - '@img/sharp-linux-s390x@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-s390x': 1.3.2 - optional: true - - '@img/sharp-linux-x64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linux-x64': 1.3.2 - optional: true - - '@img/sharp-linuxmusl-arm64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linuxmusl-arm64': 1.3.2 - optional: true - - '@img/sharp-linuxmusl-x64@0.35.3': - optionalDependencies: - '@img/sharp-libvips-linuxmusl-x64': 1.3.2 - optional: true - - '@img/sharp-wasm32@0.35.3': - dependencies: - '@emnapi/runtime': 1.11.3 - optional: true - - '@img/sharp-webcontainers-wasm32@0.35.3': - dependencies: - '@img/sharp-wasm32': 0.35.3 - optional: true - - '@img/sharp-win32-arm64@0.35.3': - optional: true - - '@img/sharp-win32-ia32@0.35.3': - optional: true - - '@img/sharp-win32-x64@0.35.3': - optional: true - - '@inquirer/ansi@2.0.7': {} - - '@inquirer/confirm@6.1.1(@types/node@24.10.4)': - dependencies: - '@inquirer/core': 11.2.1(@types/node@24.10.4) - '@inquirer/type': 4.0.7(@types/node@24.10.4) - optionalDependencies: - '@types/node': 24.10.4 - - '@inquirer/core@11.2.1(@types/node@24.10.4)': - dependencies: - '@inquirer/ansi': 2.0.7 - '@inquirer/figures': 2.0.7 - '@inquirer/type': 4.0.7(@types/node@24.10.4) - cli-width: 4.1.0 - fast-wrap-ansi: 0.2.2 - mute-stream: 3.0.0 - signal-exit: 4.1.0 - optionalDependencies: - '@types/node': 24.10.4 - - '@inquirer/figures@2.0.7': {} - - '@inquirer/type@4.0.7(@types/node@24.10.4)': - optionalDependencies: - '@types/node': 24.10.4 - - '@jridgewell/gen-mapping@0.3.13': - dependencies: - '@jridgewell/sourcemap-codec': 1.5.5 - '@jridgewell/trace-mapping': 0.3.31 - - '@jridgewell/remapping@2.3.5': - dependencies: - '@jridgewell/gen-mapping': 0.3.13 - '@jridgewell/trace-mapping': 0.3.31 - - '@jridgewell/resolve-uri@3.1.2': {} - - '@jridgewell/sourcemap-codec@1.5.5': {} - - '@jridgewell/trace-mapping@0.3.31': - dependencies: - '@jridgewell/resolve-uri': 3.1.2 - '@jridgewell/sourcemap-codec': 1.5.5 - - '@modelcontextprotocol/sdk@1.29.0(zod@3.25.76)': - dependencies: - '@hono/node-server': 1.19.14(hono@4.12.25) - ajv: 8.20.0 - ajv-formats: 3.0.1(ajv@8.20.0) - content-type: 1.0.5 - cors: 2.8.6 - cross-spawn: 7.0.6 - eventsource: 3.0.7 - eventsource-parser: 3.1.0 - express: 5.2.1 - express-rate-limit: 8.5.2(express@5.2.1) - hono: 4.12.25 - jose: 6.2.3 - json-schema-typed: 8.0.2 - pkce-challenge: 5.0.1 - raw-body: 3.0.2 - zod: 3.25.76 - zod-to-json-schema: 3.25.2(zod@3.25.76) - transitivePeerDependencies: - - supports-color - - '@mswjs/interceptors@0.41.9': - dependencies: - '@open-draft/deferred-promise': 2.2.0 - '@open-draft/logger': 0.3.0 - '@open-draft/until': 2.1.0 - is-node-process: 1.2.0 - outvariant: 1.4.3 - strict-event-emitter: 0.5.1 - - '@next/env@16.3.0': {} - - '@next/swc-darwin-arm64@16.3.0': - optional: true - - '@next/swc-darwin-x64@16.3.0': - optional: true - - '@next/swc-linux-arm64-gnu@16.3.0': - optional: true - - '@next/swc-linux-arm64-musl@16.3.0': - optional: true - - '@next/swc-linux-x64-gnu@16.3.0': - optional: true - - '@next/swc-linux-x64-musl@16.3.0': - optional: true - - '@next/swc-win32-arm64-msvc@16.3.0': - optional: true - - '@next/swc-win32-x64-msvc@16.3.0': - optional: true - - '@noble/ciphers@1.3.0': {} - - '@noble/curves@1.9.7': - dependencies: - '@noble/hashes': 1.8.0 - - '@noble/hashes@1.8.0': {} - - '@nodelib/fs.scandir@2.1.5': - dependencies: - '@nodelib/fs.stat': 2.0.5 - run-parallel: 1.2.0 - - '@nodelib/fs.stat@2.0.5': {} - - '@nodelib/fs.walk@1.2.8': - dependencies: - '@nodelib/fs.scandir': 2.1.5 - fastq: 1.20.1 - - '@open-draft/deferred-promise@2.2.0': {} - - '@open-draft/deferred-promise@3.0.0': {} - - '@open-draft/logger@0.3.0': - dependencies: - is-node-process: 1.2.0 - outvariant: 1.4.3 - - '@open-draft/until@2.1.0': {} - - '@sec-ant/readable-stream@0.4.1': {} - - '@sindresorhus/merge-streams@4.0.0': {} - - '@swc/helpers@0.5.15': - dependencies: - tslib: 2.8.1 - - '@tailwindcss/node@4.3.3': - dependencies: - '@jridgewell/remapping': 2.3.5 - enhanced-resolve: 5.24.2 - jiti: 2.7.0 - lightningcss: 1.32.0 - magic-string: 0.30.21 - source-map-js: 1.2.1 - tailwindcss: 4.3.3 - - '@tailwindcss/oxide-android-arm64@4.3.3': - optional: true - - '@tailwindcss/oxide-darwin-arm64@4.3.3': - optional: true - - '@tailwindcss/oxide-darwin-x64@4.3.3': - optional: true - - '@tailwindcss/oxide-freebsd-x64@4.3.3': - optional: true - - '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.3': - optional: true - - '@tailwindcss/oxide-linux-arm64-gnu@4.3.3': - optional: true - - '@tailwindcss/oxide-linux-arm64-musl@4.3.3': - optional: true - - '@tailwindcss/oxide-linux-x64-gnu@4.3.3': - optional: true - - '@tailwindcss/oxide-linux-x64-musl@4.3.3': - optional: true - - '@tailwindcss/oxide-wasm32-wasi@4.3.3': - optional: true - - '@tailwindcss/oxide-win32-arm64-msvc@4.3.3': - optional: true - - '@tailwindcss/oxide-win32-x64-msvc@4.3.3': - optional: true - - '@tailwindcss/oxide@4.3.3': - optionalDependencies: - '@tailwindcss/oxide-android-arm64': 4.3.3 - '@tailwindcss/oxide-darwin-arm64': 4.3.3 - '@tailwindcss/oxide-darwin-x64': 4.3.3 - '@tailwindcss/oxide-freebsd-x64': 4.3.3 - '@tailwindcss/oxide-linux-arm-gnueabihf': 4.3.3 - '@tailwindcss/oxide-linux-arm64-gnu': 4.3.3 - '@tailwindcss/oxide-linux-arm64-musl': 4.3.3 - '@tailwindcss/oxide-linux-x64-gnu': 4.3.3 - '@tailwindcss/oxide-linux-x64-musl': 4.3.3 - '@tailwindcss/oxide-wasm32-wasi': 4.3.3 - '@tailwindcss/oxide-win32-arm64-msvc': 4.3.3 - '@tailwindcss/oxide-win32-x64-msvc': 4.3.3 - - '@tailwindcss/postcss@4.3.3': - dependencies: - '@alloc/quick-lru': 5.2.0 - '@tailwindcss/node': 4.3.3 - '@tailwindcss/oxide': 4.3.3 - postcss: 8.5.19 - tailwindcss: 4.3.3 - - '@ts-morph/common@0.27.0': - dependencies: - fast-glob: 3.3.3 - minimatch: 10.2.5 - path-browserify: 1.0.1 - - '@types/node@24.10.4': - dependencies: - undici-types: 7.16.0 - - '@types/react-dom@19.2.3(@types/react@19.2.14)': - dependencies: - '@types/react': 19.2.14 - - '@types/react@19.2.14': - dependencies: - csstype: 3.2.3 - - '@types/set-cookie-parser@2.4.10': - dependencies: - '@types/node': 24.10.4 - - '@types/statuses@2.0.6': {} - - '@types/validate-npm-package-name@4.0.2': {} - - '@vercel/analytics@1.6.1(next@16.3.0(@babel/core@7.29.7)(@types/node@24.10.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4))(react@19.2.4)': - optionalDependencies: - next: 16.3.0(@babel/core@7.29.7)(@types/node@24.10.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) - react: 19.2.4 - - accepts@2.0.0: - dependencies: - mime-types: 3.0.2 - negotiator: 1.0.0 - - agent-base@7.1.4: {} - - ajv-formats@3.0.1(ajv@8.20.0): - optionalDependencies: - ajv: 8.20.0 - - ajv@8.20.0: - dependencies: - fast-deep-equal: 3.1.3 - fast-uri: 3.1.2 - json-schema-traverse: 1.0.0 - require-from-string: 2.0.2 - - ansi-colors@4.1.3: {} - - ansi-regex@5.0.1: {} - - ansi-regex@6.2.2: {} - - ansi-styles@4.3.0: - dependencies: - color-convert: 2.0.1 - - argparse@2.0.1: {} - - ast-types@0.16.1: - dependencies: - tslib: 2.8.1 - - balanced-match@4.0.4: {} - - baseline-browser-mapping@2.9.19: {} - - body-parser@2.2.2: - dependencies: - bytes: 3.1.2 - content-type: 1.0.5 - debug: 4.4.3 - http-errors: 2.0.1 - iconv-lite: 0.7.2 - on-finished: 2.4.1 - qs: 6.15.2 - raw-body: 3.0.2 - type-is: 2.1.0 - transitivePeerDependencies: - - supports-color - - brace-expansion@5.0.6: - dependencies: - balanced-match: 4.0.4 - - braces@3.0.3: - dependencies: - fill-range: 7.1.1 - - browserslist@4.28.1: - dependencies: - baseline-browser-mapping: 2.9.19 - caniuse-lite: 1.0.30001769 - electron-to-chromium: 1.5.286 - node-releases: 2.0.27 - update-browserslist-db: 1.2.3(browserslist@4.28.1) - - bundle-name@4.1.0: - dependencies: - run-applescript: 7.1.0 - - bytes@3.1.2: {} - - call-bind-apply-helpers@1.0.2: - dependencies: - es-errors: 1.3.0 - function-bind: 1.1.2 - - call-bound@1.0.4: - dependencies: - call-bind-apply-helpers: 1.0.2 - get-intrinsic: 1.3.0 - - callsites@3.1.0: {} - - caniuse-lite@1.0.30001769: {} - - chalk@5.6.2: {} - - class-variance-authority@0.7.1: - dependencies: - clsx: 2.1.1 - - cli-cursor@5.0.0: - dependencies: - restore-cursor: 5.1.0 - - cli-spinners@2.9.2: {} - - cli-width@4.1.0: {} - - client-only@0.0.1: {} - - cliui@8.0.1: - dependencies: - string-width: 4.2.3 - strip-ansi: 6.0.1 - wrap-ansi: 7.0.0 - - clsx@2.1.1: {} - - code-block-writer@13.0.3: {} - - color-convert@2.0.1: - dependencies: - color-name: 1.1.4 - - color-name@1.1.4: {} - - commander@11.1.0: {} - - commander@14.0.3: {} - - content-disposition@1.1.0: {} - - content-type@1.0.5: {} - - content-type@2.0.0: {} - - convert-source-map@2.0.0: {} - - cookie-signature@1.2.2: {} - - cookie@0.7.2: {} - - cookie@1.1.1: {} - - cors@2.8.6: - dependencies: - object-assign: 4.1.1 - vary: 1.1.2 - - cosmiconfig@9.0.1(typescript@5.7.3): - dependencies: - env-paths: 2.2.1 - import-fresh: 3.3.1 - js-yaml: 4.2.0 - parse-json: 5.2.0 - optionalDependencies: - typescript: 5.7.3 - - cross-spawn@7.0.6: - dependencies: - path-key: 3.1.1 - shebang-command: 2.0.0 - which: 2.0.2 - - cssesc@3.0.0: {} - - csstype@3.2.3: {} - - data-uri-to-buffer@4.0.1: {} - - date-fns@4.1.0: - optional: true - - debug@4.4.3: - dependencies: - ms: 2.1.3 - - dedent@1.7.2: {} - - deepmerge@4.3.1: {} - - default-browser-id@5.0.1: {} - - default-browser@5.5.0: - dependencies: - bundle-name: 4.1.0 - default-browser-id: 5.0.1 - - define-lazy-prop@3.0.0: {} - - depd@2.0.0: {} - - detect-libc@2.1.2: {} - - diff@8.0.4: {} - - dotenv@17.4.2: {} - - dunder-proto@1.0.1: - dependencies: - call-bind-apply-helpers: 1.0.2 - es-errors: 1.3.0 - gopd: 1.2.0 - - eciesjs@0.4.18: - dependencies: - '@ecies/ciphers': 0.2.6(@noble/ciphers@1.3.0) - '@noble/ciphers': 1.3.0 - '@noble/curves': 1.9.7 - '@noble/hashes': 1.8.0 - - ee-first@1.1.1: {} - - electron-to-chromium@1.5.286: {} - - emoji-regex@10.6.0: {} - - emoji-regex@8.0.0: {} - - encodeurl@2.0.0: {} - - enhanced-resolve@5.24.2: - dependencies: - graceful-fs: 4.2.11 - tapable: 2.3.3 - - enquirer@2.4.1: - dependencies: - ansi-colors: 4.1.3 - strip-ansi: 6.0.1 - - env-paths@2.2.1: {} - - error-ex@1.3.4: - dependencies: - is-arrayish: 0.2.1 - - es-define-property@1.0.1: {} - - es-errors@1.3.0: {} - - es-object-atoms@1.1.2: - dependencies: - es-errors: 1.3.0 - - escalade@3.2.0: {} - - escape-html@1.0.3: {} - - esprima@4.0.1: {} - - etag@1.8.1: {} - - eventsource-parser@3.1.0: {} - - eventsource@3.0.7: - dependencies: - eventsource-parser: 3.1.0 - - execa@5.1.1: - dependencies: - cross-spawn: 7.0.6 - get-stream: 6.0.1 - human-signals: 2.1.0 - is-stream: 2.0.1 - merge-stream: 2.0.0 - npm-run-path: 4.0.1 - onetime: 5.1.2 - signal-exit: 3.0.7 - strip-final-newline: 2.0.0 - - execa@9.6.1: - dependencies: - '@sindresorhus/merge-streams': 4.0.0 - cross-spawn: 7.0.6 - figures: 6.1.0 - get-stream: 9.0.1 - human-signals: 8.0.1 - is-plain-obj: 4.1.0 - is-stream: 4.0.1 - npm-run-path: 6.0.0 - pretty-ms: 9.3.0 - signal-exit: 4.1.0 - strip-final-newline: 4.0.0 - yoctocolors: 2.1.2 - - express-rate-limit@8.5.2(express@5.2.1): - dependencies: - express: 5.2.1 - ip-address: 10.2.0 - - express@5.2.1: - dependencies: - accepts: 2.0.0 - body-parser: 2.2.2 - content-disposition: 1.1.0 - content-type: 1.0.5 - cookie: 0.7.2 - cookie-signature: 1.2.2 - debug: 4.4.3 - depd: 2.0.0 - encodeurl: 2.0.0 - escape-html: 1.0.3 - etag: 1.8.1 - finalhandler: 2.1.1 - fresh: 2.0.0 - http-errors: 2.0.1 - merge-descriptors: 2.0.0 - mime-types: 3.0.2 - on-finished: 2.4.1 - once: 1.4.0 - parseurl: 1.3.3 - proxy-addr: 2.0.7 - qs: 6.15.2 - range-parser: 1.2.1 - router: 2.2.0 - send: 1.2.1 - serve-static: 2.2.1 - statuses: 2.0.2 - type-is: 2.1.0 - vary: 1.1.2 - transitivePeerDependencies: - - supports-color - - fast-deep-equal@3.1.3: {} - - fast-glob@3.3.3: - dependencies: - '@nodelib/fs.stat': 2.0.5 - '@nodelib/fs.walk': 1.2.8 - glob-parent: 5.1.2 - merge2: 1.4.1 - micromatch: 4.0.8 - - fast-string-truncated-width@3.0.3: {} - - fast-string-width@3.0.2: - dependencies: - fast-string-truncated-width: 3.0.3 - - fast-uri@3.1.2: {} - - fast-wrap-ansi@0.2.2: - dependencies: - fast-string-width: 3.0.2 - - fastq@1.20.1: - dependencies: - reusify: 1.1.0 - - fdir@6.5.0(picomatch@4.0.4): - optionalDependencies: - picomatch: 4.0.4 - - fetch-blob@3.2.0: - dependencies: - node-domexception: 1.0.0 - web-streams-polyfill: 3.3.3 - - figures@6.1.0: - dependencies: - is-unicode-supported: 2.1.0 - - fill-range@7.1.1: - dependencies: - to-regex-range: 5.0.1 - - finalhandler@2.1.1: - dependencies: - debug: 4.4.3 - encodeurl: 2.0.0 - escape-html: 1.0.3 - on-finished: 2.4.1 - parseurl: 1.3.3 - statuses: 2.0.2 - transitivePeerDependencies: - - supports-color - - formdata-polyfill@4.0.10: - dependencies: - fetch-blob: 3.2.0 - - forwarded@0.2.0: {} - - fresh@2.0.0: {} - - fs-extra@11.3.5: - dependencies: - graceful-fs: 4.2.11 - jsonfile: 6.2.1 - universalify: 2.0.1 - - function-bind@1.1.2: {} - - fuzzysort@3.1.0: {} - - gensync@1.0.0-beta.2: {} - - get-caller-file@2.0.5: {} - - get-east-asian-width@1.6.0: {} - - get-intrinsic@1.3.0: - dependencies: - call-bind-apply-helpers: 1.0.2 - es-define-property: 1.0.1 - es-errors: 1.3.0 - es-object-atoms: 1.1.2 - function-bind: 1.1.2 - get-proto: 1.0.1 - gopd: 1.2.0 - has-symbols: 1.1.0 - hasown: 2.0.4 - math-intrinsics: 1.1.0 - - get-own-enumerable-keys@1.0.0: {} - - get-proto@1.0.1: - dependencies: - dunder-proto: 1.0.1 - es-object-atoms: 1.1.2 - - get-stream@6.0.1: {} - - get-stream@9.0.1: - dependencies: - '@sec-ant/readable-stream': 0.4.1 - is-stream: 4.0.1 - - glob-parent@5.1.2: - dependencies: - is-glob: 4.0.3 - - gopd@1.2.0: {} - - graceful-fs@4.2.11: {} - - graphql@16.14.0: {} - - has-symbols@1.1.0: {} - - hasown@2.0.4: - dependencies: - function-bind: 1.1.2 - - headers-polyfill@5.0.1: - dependencies: - '@types/set-cookie-parser': 2.4.10 - set-cookie-parser: 3.1.0 - - hono@4.12.25: {} - - http-errors@2.0.1: - dependencies: - depd: 2.0.0 - inherits: 2.0.4 - setprototypeof: 1.2.0 - statuses: 2.0.2 - toidentifier: 1.0.1 - - https-proxy-agent@7.0.6: - dependencies: - agent-base: 7.1.4 - debug: 4.4.3 - transitivePeerDependencies: - - supports-color - - human-signals@2.1.0: {} - - human-signals@8.0.1: {} - - iconv-lite@0.7.2: - dependencies: - safer-buffer: 2.1.2 - - ignore@5.3.2: {} - - import-fresh@3.3.1: - dependencies: - parent-module: 1.0.1 - resolve-from: 4.0.0 - - inherits@2.0.4: {} - - ip-address@10.2.0: {} - - ipaddr.js@1.9.1: {} - - is-arrayish@0.2.1: {} - - is-docker@3.0.0: {} - - is-extglob@2.1.1: {} - - is-fullwidth-code-point@3.0.0: {} - - is-glob@4.0.3: - dependencies: - is-extglob: 2.1.1 - - is-in-ssh@1.0.0: {} - - is-inside-container@1.0.0: - dependencies: - is-docker: 3.0.0 - - is-interactive@2.0.0: {} - - is-node-process@1.2.0: {} - - is-number@7.0.0: {} - - is-obj@3.0.0: {} - - is-plain-obj@4.1.0: {} - - is-promise@4.0.0: {} - - is-regexp@3.1.0: {} - - is-stream@2.0.1: {} - - is-stream@4.0.1: {} - - is-unicode-supported@1.3.0: {} - - is-unicode-supported@2.1.0: {} - - is-wsl@3.1.1: - dependencies: - is-inside-container: 1.0.0 - - isexe@2.0.0: {} - - isexe@3.1.5: {} - - jiti@2.7.0: {} - - jose@6.2.3: {} - - js-tokens@4.0.0: {} - - js-yaml@4.2.0: - dependencies: - argparse: 2.0.1 - - jsesc@3.1.0: {} - - json-parse-even-better-errors@2.3.1: {} - - json-schema-traverse@1.0.0: {} - - json-schema-typed@8.0.2: {} - - json5@2.2.3: {} - - jsonfile@6.2.1: - dependencies: - universalify: 2.0.1 - optionalDependencies: - graceful-fs: 4.2.11 - - kleur@3.0.3: {} - - kleur@4.1.5: {} - - lightningcss-android-arm64@1.32.0: - optional: true - - lightningcss-darwin-arm64@1.32.0: - optional: true - - lightningcss-darwin-x64@1.32.0: - optional: true - - lightningcss-freebsd-x64@1.32.0: - optional: true - - lightningcss-linux-arm-gnueabihf@1.32.0: - optional: true - - lightningcss-linux-arm64-gnu@1.32.0: - optional: true - - lightningcss-linux-arm64-musl@1.32.0: - optional: true - - lightningcss-linux-x64-gnu@1.32.0: - optional: true - - lightningcss-linux-x64-musl@1.32.0: - optional: true - - lightningcss-win32-arm64-msvc@1.32.0: - optional: true - - lightningcss-win32-x64-msvc@1.32.0: - optional: true - - lightningcss@1.32.0: - dependencies: - detect-libc: 2.1.2 - optionalDependencies: - lightningcss-android-arm64: 1.32.0 - lightningcss-darwin-arm64: 1.32.0 - lightningcss-darwin-x64: 1.32.0 - lightningcss-freebsd-x64: 1.32.0 - lightningcss-linux-arm-gnueabihf: 1.32.0 - lightningcss-linux-arm64-gnu: 1.32.0 - lightningcss-linux-arm64-musl: 1.32.0 - lightningcss-linux-x64-gnu: 1.32.0 - lightningcss-linux-x64-musl: 1.32.0 - lightningcss-win32-arm64-msvc: 1.32.0 - lightningcss-win32-x64-msvc: 1.32.0 - - lines-and-columns@1.2.4: {} - - log-symbols@6.0.0: - dependencies: - chalk: 5.6.2 - is-unicode-supported: 1.3.0 - - lru-cache@5.1.1: - dependencies: - yallist: 3.1.1 - - lucide-react@1.17.0(react@19.2.4): - dependencies: - react: 19.2.4 - - magic-string@0.30.21: - dependencies: - '@jridgewell/sourcemap-codec': 1.5.5 - - math-intrinsics@1.1.0: {} - - media-typer@1.1.0: {} - - merge-descriptors@2.0.0: {} - - merge-stream@2.0.0: {} - - merge2@1.4.1: {} - - micromatch@4.0.8: - dependencies: - braces: 3.0.3 - picomatch: 2.3.2 - - mime-db@1.54.0: {} - - mime-types@3.0.2: - dependencies: - mime-db: 1.54.0 - - mimic-fn@2.1.0: {} - - mimic-function@5.0.1: {} - - minimatch@10.2.5: - dependencies: - brace-expansion: 5.0.6 - - minimist@1.2.8: {} - - ms@2.1.3: {} - - msw@2.14.6(@types/node@24.10.4)(typescript@5.7.3): - dependencies: - '@inquirer/confirm': 6.1.1(@types/node@24.10.4) - '@mswjs/interceptors': 0.41.9 - '@open-draft/deferred-promise': 3.0.0 - '@types/statuses': 2.0.6 - cookie: 1.1.1 - graphql: 16.14.0 - headers-polyfill: 5.0.1 - is-node-process: 1.2.0 - outvariant: 1.4.3 - path-to-regexp: 6.3.0 - picocolors: 1.1.1 - rettime: 0.11.11 - statuses: 2.0.2 - strict-event-emitter: 0.5.1 - tough-cookie: 6.0.1 - type-fest: 5.7.0 - until-async: 3.0.2 - yargs: 17.7.2 - optionalDependencies: - typescript: 5.7.3 - transitivePeerDependencies: - - '@types/node' - - mute-stream@3.0.0: {} - - nanoid@3.3.11: {} - - nanoid@3.3.16: {} - - negotiator@1.0.0: {} - - next@16.3.0(@babel/core@7.29.7)(@types/node@24.10.4)(react-dom@19.2.4(react@19.2.4))(react@19.2.4): - dependencies: - '@next/env': 16.3.0 - '@swc/helpers': 0.5.15 - baseline-browser-mapping: 2.9.19 - caniuse-lite: 1.0.30001769 - postcss: 8.5.23 - react: 19.2.4 - react-dom: 19.2.4(react@19.2.4) - styled-jsx: 5.1.6(@babel/core@7.29.7)(react@19.2.4) - optionalDependencies: - '@next/swc-darwin-arm64': 16.3.0 - '@next/swc-darwin-x64': 16.3.0 - '@next/swc-linux-arm64-gnu': 16.3.0 - '@next/swc-linux-arm64-musl': 16.3.0 - '@next/swc-linux-x64-gnu': 16.3.0 - '@next/swc-linux-x64-musl': 16.3.0 - '@next/swc-win32-arm64-msvc': 16.3.0 - '@next/swc-win32-x64-msvc': 16.3.0 - sharp: 0.35.3(@types/node@24.10.4) - transitivePeerDependencies: - - '@babel/core' - - '@types/node' - - babel-plugin-macros - - node-domexception@1.0.0: {} - - node-fetch@3.3.2: - dependencies: - data-uri-to-buffer: 4.0.1 - fetch-blob: 3.2.0 - formdata-polyfill: 4.0.10 - - node-releases@2.0.27: {} - - npm-run-path@4.0.1: - dependencies: - path-key: 3.1.1 - - npm-run-path@6.0.0: - dependencies: - path-key: 4.0.0 - unicorn-magic: 0.3.0 - - object-assign@4.1.1: {} - - object-inspect@1.13.4: {} - - object-treeify@1.1.33: {} - - on-finished@2.4.1: - dependencies: - ee-first: 1.1.1 - - once@1.4.0: - dependencies: - wrappy: 1.0.2 - - onetime@5.1.2: - dependencies: - mimic-fn: 2.1.0 - - onetime@7.0.0: - dependencies: - mimic-function: 5.0.1 - - open@11.0.0: - dependencies: - default-browser: 5.5.0 - define-lazy-prop: 3.0.0 - is-in-ssh: 1.0.0 - is-inside-container: 1.0.0 - powershell-utils: 0.1.0 - wsl-utils: 0.3.1 - - ora@8.2.0: - dependencies: - chalk: 5.6.2 - cli-cursor: 5.0.0 - cli-spinners: 2.9.2 - is-interactive: 2.0.0 - is-unicode-supported: 2.1.0 - log-symbols: 6.0.0 - stdin-discarder: 0.2.2 - string-width: 7.2.0 - strip-ansi: 7.2.0 - - outvariant@1.4.3: {} - - parent-module@1.0.1: - dependencies: - callsites: 3.1.0 - - parse-json@5.2.0: - dependencies: - '@babel/code-frame': 7.29.7 - error-ex: 1.3.4 - json-parse-even-better-errors: 2.3.1 - lines-and-columns: 1.2.4 - - parse-ms@4.0.0: {} - - parseurl@1.3.3: {} - - path-browserify@1.0.1: {} - - path-key@3.1.1: {} - - path-key@4.0.0: {} - - path-to-regexp@6.3.0: {} - - path-to-regexp@8.4.2: {} - - picocolors@1.1.1: {} - - picomatch@2.3.2: {} - - picomatch@4.0.4: {} - - pkce-challenge@5.0.1: {} - - postcss-selector-parser@7.1.1: - dependencies: - cssesc: 3.0.0 - util-deprecate: 1.0.2 - - postcss@8.5.19: - dependencies: - nanoid: 3.3.16 - picocolors: 1.1.1 - source-map-js: 1.2.1 - - postcss@8.5.23: - dependencies: - nanoid: 3.3.16 - picocolors: 1.1.1 - source-map-js: 1.2.1 - - postcss@8.5.6: - dependencies: - nanoid: 3.3.11 - picocolors: 1.1.1 - source-map-js: 1.2.1 - - powershell-utils@0.1.0: {} - - pretty-ms@9.3.0: - dependencies: - parse-ms: 4.0.0 - - prompts@2.4.2: - dependencies: - kleur: 3.0.3 - sisteransi: 1.0.5 - - proxy-addr@2.0.7: - dependencies: - forwarded: 0.2.0 - ipaddr.js: 1.9.1 - - qs@6.15.2: - dependencies: - side-channel: 1.1.0 - - queue-microtask@1.2.3: {} - - range-parser@1.2.1: {} - - raw-body@3.0.2: - dependencies: - bytes: 3.1.2 - http-errors: 2.0.1 - iconv-lite: 0.7.2 - unpipe: 1.0.0 - - react-dom@19.2.4(react@19.2.4): - dependencies: - react: 19.2.4 - scheduler: 0.27.0 - - react@19.2.4: {} - - recast@0.23.11: - dependencies: - ast-types: 0.16.1 - esprima: 4.0.1 - source-map: 0.6.1 - tiny-invariant: 1.3.3 - tslib: 2.8.1 - - require-directory@2.1.1: {} - - require-from-string@2.0.2: {} - - reselect@5.2.0: {} - - resolve-from@4.0.0: {} - - restore-cursor@5.1.0: - dependencies: - onetime: 7.0.0 - signal-exit: 4.1.0 - - rettime@0.11.11: {} - - reusify@1.1.0: {} - - router@2.2.0: - dependencies: - debug: 4.4.3 - depd: 2.0.0 - is-promise: 4.0.0 - parseurl: 1.3.3 - path-to-regexp: 8.4.2 - transitivePeerDependencies: - - supports-color - - run-applescript@7.1.0: {} - - run-parallel@1.2.0: - dependencies: - queue-microtask: 1.2.3 - - safer-buffer@2.1.2: {} - - scheduler@0.27.0: {} - - semver@6.3.1: {} - - semver@7.8.5: - optional: true - - send@1.2.1: - dependencies: - debug: 4.4.3 - encodeurl: 2.0.0 - escape-html: 1.0.3 - etag: 1.8.1 - fresh: 2.0.0 - http-errors: 2.0.1 - mime-types: 3.0.2 - ms: 2.1.3 - on-finished: 2.4.1 - range-parser: 1.2.1 - statuses: 2.0.2 - transitivePeerDependencies: - - supports-color - - serve-static@2.2.1: - dependencies: - encodeurl: 2.0.0 - escape-html: 1.0.3 - parseurl: 1.3.3 - send: 1.2.1 - transitivePeerDependencies: - - supports-color - - set-cookie-parser@3.1.0: {} - - setprototypeof@1.2.0: {} - - shadcn@4.10.0(@types/node@24.10.4)(typescript@5.7.3): - dependencies: - '@babel/core': 7.29.7 - '@babel/parser': 7.29.7 - '@babel/plugin-transform-typescript': 7.29.7(@babel/core@7.29.7) - '@babel/preset-typescript': 7.29.7(@babel/core@7.29.7) - '@dotenvx/dotenvx': 1.70.0 - '@modelcontextprotocol/sdk': 1.29.0(zod@3.25.76) - '@types/validate-npm-package-name': 4.0.2 - browserslist: 4.28.1 - commander: 14.0.3 - cosmiconfig: 9.0.1(typescript@5.7.3) - dedent: 1.7.2 - deepmerge: 4.3.1 - diff: 8.0.4 - execa: 9.6.1 - fast-glob: 3.3.3 - fs-extra: 11.3.5 - fuzzysort: 3.1.0 - https-proxy-agent: 7.0.6 - kleur: 4.1.5 - msw: 2.14.6(@types/node@24.10.4)(typescript@5.7.3) - node-fetch: 3.3.2 - open: 11.0.0 - ora: 8.2.0 - postcss: 8.5.6 - postcss-selector-parser: 7.1.1 - prompts: 2.4.2 - recast: 0.23.11 - stringify-object: 5.0.0 - tailwind-merge: 3.4.0 - ts-morph: 26.0.0 - tsconfig-paths: 4.2.0 - validate-npm-package-name: 7.0.2 - zod: 3.25.76 - zod-to-json-schema: 3.25.2(zod@3.25.76) - transitivePeerDependencies: - - '@cfworker/json-schema' - - '@types/node' - - babel-plugin-macros - - supports-color - - typescript - - sharp@0.35.3(@types/node@24.10.4): - dependencies: - '@img/colour': 1.1.0 - detect-libc: 2.1.2 - semver: 7.8.5 - optionalDependencies: - '@img/sharp-darwin-arm64': 0.35.3 - '@img/sharp-darwin-x64': 0.35.3 - '@img/sharp-freebsd-wasm32': 0.35.3 - '@img/sharp-libvips-darwin-arm64': 1.3.2 - '@img/sharp-libvips-darwin-x64': 1.3.2 - '@img/sharp-libvips-linux-arm': 1.3.2 - '@img/sharp-libvips-linux-arm64': 1.3.2 - '@img/sharp-libvips-linux-ppc64': 1.3.2 - '@img/sharp-libvips-linux-riscv64': 1.3.2 - '@img/sharp-libvips-linux-s390x': 1.3.2 - '@img/sharp-libvips-linux-x64': 1.3.2 - '@img/sharp-libvips-linuxmusl-arm64': 1.3.2 - '@img/sharp-libvips-linuxmusl-x64': 1.3.2 - '@img/sharp-linux-arm': 0.35.3 - '@img/sharp-linux-arm64': 0.35.3 - '@img/sharp-linux-ppc64': 0.35.3 - '@img/sharp-linux-riscv64': 0.35.3 - '@img/sharp-linux-s390x': 0.35.3 - '@img/sharp-linux-x64': 0.35.3 - '@img/sharp-linuxmusl-arm64': 0.35.3 - '@img/sharp-linuxmusl-x64': 0.35.3 - '@img/sharp-webcontainers-wasm32': 0.35.3 - '@img/sharp-win32-arm64': 0.35.3 - '@img/sharp-win32-ia32': 0.35.3 - '@img/sharp-win32-x64': 0.35.3 - '@types/node': 24.10.4 - optional: true - - shebang-command@2.0.0: - dependencies: - shebang-regex: 3.0.0 - - shebang-regex@3.0.0: {} - - side-channel-list@1.0.1: - dependencies: - es-errors: 1.3.0 - object-inspect: 1.13.4 - - side-channel-map@1.0.1: - dependencies: - call-bound: 1.0.4 - es-errors: 1.3.0 - get-intrinsic: 1.3.0 - object-inspect: 1.13.4 - - side-channel-weakmap@1.0.2: - dependencies: - call-bound: 1.0.4 - es-errors: 1.3.0 - get-intrinsic: 1.3.0 - object-inspect: 1.13.4 - side-channel-map: 1.0.1 - - side-channel@1.1.0: - dependencies: - es-errors: 1.3.0 - object-inspect: 1.13.4 - side-channel-list: 1.0.1 - side-channel-map: 1.0.1 - side-channel-weakmap: 1.0.2 - - signal-exit@3.0.7: {} - - signal-exit@4.1.0: {} - - sisteransi@1.0.5: {} - - source-map-js@1.2.1: {} - - source-map@0.6.1: {} - - statuses@2.0.2: {} - - stdin-discarder@0.2.2: {} - - strict-event-emitter@0.5.1: {} - - string-width@4.2.3: - dependencies: - emoji-regex: 8.0.0 - is-fullwidth-code-point: 3.0.0 - strip-ansi: 6.0.1 - - string-width@7.2.0: - dependencies: - emoji-regex: 10.6.0 - get-east-asian-width: 1.6.0 - strip-ansi: 7.2.0 - - stringify-object@5.0.0: - dependencies: - get-own-enumerable-keys: 1.0.0 - is-obj: 3.0.0 - is-regexp: 3.1.0 - - strip-ansi@6.0.1: - dependencies: - ansi-regex: 5.0.1 - - strip-ansi@7.2.0: - dependencies: - ansi-regex: 6.2.2 - - strip-bom@3.0.0: {} - - strip-final-newline@2.0.0: {} - - strip-final-newline@4.0.0: {} - - styled-jsx@5.1.6(@babel/core@7.29.7)(react@19.2.4): - dependencies: - client-only: 0.0.1 - react: 19.2.4 - optionalDependencies: - '@babel/core': 7.29.7 - - tagged-tag@1.0.0: {} - - tailwind-merge@3.4.0: {} - - tailwindcss@4.3.3: {} - - tapable@2.3.3: {} - - tiny-invariant@1.3.3: {} - - tldts-core@7.4.2: {} - - tldts@7.4.2: - dependencies: - tldts-core: 7.4.2 - - to-regex-range@5.0.1: - dependencies: - is-number: 7.0.0 - - toidentifier@1.0.1: {} - - tough-cookie@6.0.1: - dependencies: - tldts: 7.4.2 - - ts-morph@26.0.0: - dependencies: - '@ts-morph/common': 0.27.0 - code-block-writer: 13.0.3 - - tsconfig-paths@4.2.0: - dependencies: - json5: 2.2.3 - minimist: 1.2.8 - strip-bom: 3.0.0 - - tslib@2.8.1: {} - - tw-animate-css@1.4.0: {} - - type-fest@5.7.0: - dependencies: - tagged-tag: 1.0.0 - - type-is@2.1.0: - dependencies: - content-type: 2.0.0 - media-typer: 1.1.0 - mime-types: 3.0.2 - - typescript@5.7.3: {} - - undici-types@7.16.0: {} - - unicorn-magic@0.3.0: {} - - universalify@2.0.1: {} - - unpipe@1.0.0: {} - - until-async@3.0.2: {} - - update-browserslist-db@1.2.3(browserslist@4.28.1): - dependencies: - browserslist: 4.28.1 - escalade: 3.2.0 - picocolors: 1.1.1 - - use-sync-external-store@1.6.0(react@19.2.4): - dependencies: - react: 19.2.4 - - util-deprecate@1.0.2: {} - - validate-npm-package-name@7.0.2: {} - - vary@1.1.2: {} - - web-streams-polyfill@3.3.3: {} - - which@2.0.2: - dependencies: - isexe: 2.0.0 - - which@4.0.0: - dependencies: - isexe: 3.1.5 - - wrap-ansi@7.0.0: - dependencies: - ansi-styles: 4.3.0 - string-width: 4.2.3 - strip-ansi: 6.0.1 - - wrappy@1.0.2: {} - - wsl-utils@0.3.1: - dependencies: - is-wsl: 3.1.1 - powershell-utils: 0.1.0 - - y18n@5.0.8: {} - - yallist@3.1.1: {} - - yargs-parser@21.1.1: {} - - yargs@17.7.2: - dependencies: - cliui: 8.0.1 - escalade: 3.2.0 - get-caller-file: 2.0.5 - require-directory: 2.1.1 - string-width: 4.2.3 - y18n: 5.0.8 - yargs-parser: 21.1.1 - - yocto-spinner@1.2.0: - dependencies: - yoctocolors: 2.1.2 - - yoctocolors@2.1.2: {} - - zod-to-json-schema@3.25.2(zod@3.25.76): - dependencies: - zod: 3.25.76 - - zod@3.25.76: {} diff --git a/refs/pnpm-workspace.yaml b/refs/pnpm-workspace.yaml deleted file mode 100644 index 8181285..0000000 --- a/refs/pnpm-workspace.yaml +++ /dev/null @@ -1,2 +0,0 @@ -allowBuilds: - msw: set this to true or false diff --git a/refs/postcss.config.mjs b/refs/postcss.config.mjs deleted file mode 100644 index a869506..0000000 --- a/refs/postcss.config.mjs +++ /dev/null @@ -1,8 +0,0 @@ -/** @type {import('postcss-load-config').Config} */ -const config = { - plugins: { - '@tailwindcss/postcss': {}, - }, -} - -export default config diff --git a/refs/public/placeholder-user.jpg b/refs/public/placeholder-user.jpg deleted file mode 100644 index 6fa7543d38ed8fdb38f03b5c0f40ad2d66827d4a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1635 zcmex=cRarq{jAqGJXh7$}Ym>C5bm;@P_1sVSzVUPwol9>?*7~p`Fjh%&&i5Vyo`r#xP0%qgXfnHy zn7E>$Lug{-LIb0a!ifhj3W%7RB^MNLx}>0_tP&7BY4IaqjBo(siP4_n_ky5FEmL(` zmhdc@Jb`OxUUPQK!#sq(C`ZJd3YCA-U zh)gnS;tOzhJ@#Yf$SRGl2DVF#R;SL@d2ijhdh5m?{S3~XPpnp*$)2k2D4JJuYTMD;n0K36=Y8OJ z-mS1ZZC1 z49BdqoLoM_v$9v)Hm?5W<`Stp{n4{)u7wjb{~fvi z!T;47&))dGMoGtVj(5+GENxwrz4z{INB>V}1-4JUxp@DgJ8LKAUAQWhoR~X5%Wp!~ z=~v%IB`XWv>j>XTei(%h-3q0fm1bY5udCHKmu^f&G@&$==-St!-gGk?J$~inXs)aj#q07WR4- zM=rxkFUy8C!QJtD_bgKux*|B+dhW6{-z2Xe?@~0Ks(ijMro-3a&Mj#N$xpGBRnmWt zTsUxz-_bhtPjF={K-%Z^57b<}UkWR&Lo)qWhnrV2yD?(SL?Q-l9d; zHS6^j9!_Ejaqqemoyn}=@ptvvS-S7I7N7FZ5}(WNv3l;#-@XTLOmcJGRz1a7FhcBC z-nPY(UsETGE4&Rdme=pC+jj2j;!j+6o-!m}7oD?jz2dGcAvK4%qSmfE=U+z7Z+`#j z$Mx4a@1yJ$R+zt@y0z(yW_ISH^4k|<^!Al@?-M=r`gz3ehXgqVyM1>}k-Q}GF<-;) z*LLGyVd)Qk|Ji$(J?dTY-07-((_=n_`3T&d5FiH|guzja;wny>q}tw+C34*a{8 zfJ9i0DbumfeTVp1E#|(wudjdSJE%AnL@H&$nSBB{^D;34Gp|fN9u>e68m!_b0O__- AD*ylh diff --git a/refs/public/placeholder.jpg b/refs/public/placeholder.jpg deleted file mode 100644 index 6bfe96336dbe567f5f1e9129f5bccdc78b114bba..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1064 zcmb7@Nla5w6o$`zL;Ko7c&|)~7+MC)5J;K9giwZ-mWToZDl29|7tA;;v?z!g5*b9% zRSP(-1ZOwO;J6Z;05{Ybq6y%HZtA^{7Ghj^Zu0K`Ud}o9eCM5OpR~^apJ^}|03iS) zUSPLDyMAv~1wd97gaQBuEK&lE6~YUU53r&J$VBT_bS?^Z_)q|CRlqoW3h_=1XC~2( zowlIWj23Fe8(HX8O~UM7AR)W5x}mzhvbshU9ifGUR8tm1vSSl)WSJzz{QQ zmi2yKNVU))a_#4eg7^#He zB=v{_T40oFHqzanm!#xGc@)^&2;D-M({g?EZs?j~+jH z`uxSqSCdoIGw \ No newline at end of file diff --git a/refs/tsconfig.json b/refs/tsconfig.json deleted file mode 100644 index d3a3fd1..0000000 --- a/refs/tsconfig.json +++ /dev/null @@ -1,33 +0,0 @@ -{ - "compilerOptions": { - "lib": ["dom", "dom.iterable", "esnext"], - "allowJs": true, - "target": "ES6", - "skipLibCheck": true, - "strict": true, - "noEmit": true, - "esModuleInterop": true, - "module": "esnext", - "moduleResolution": "bundler", - "resolveJsonModule": true, - "isolatedModules": true, - "jsx": "react-jsx", - "incremental": true, - "plugins": [ - { - "name": "next" - } - ], - "paths": { - "@/*": ["./*"] - } - }, - "include": [ - "next-env.d.ts", - "**/*.ts", - "**/*.tsx", - ".next/types/**/*.ts", - ".next/dev/types/**/*.ts" - ], - "exclude": ["node_modules"] -} diff --git a/scripts/extract-static.mjs b/scripts/extract-static.mjs deleted file mode 100644 index 4d7f29b..0000000 --- a/scripts/extract-static.mjs +++ /dev/null @@ -1,252 +0,0 @@ -import { readFileSync, writeFileSync, mkdirSync, readdirSync, statSync, existsSync } from "node:fs"; -import { join, dirname, basename, extname } from "node:path"; -import { fileURLToPath } from "node:url"; - -// Usage: node extract-static.mjs -// e.g. node extract-static.mjs .next\server\app ..\refs-html - -const root = process.argv[2]; -const dest = process.argv[3]; - -// --- inject a minimal theme toggle (extraction strips all -`; - -function injectThemeToggle(html) { - if (html.includes("__themeToggleInjected")) return html; - const tag = ""; - if (html.includes(tag)) return html.replace(tag, THEME_TOGGLE + "\n" + tag); - if (html.includes("")) return html.replace("", THEME_TOGGLE + "\n"); - return html + "\n" + THEME_TOGGLE; -} - -// --- CSS: find the compiled chunk and pretty-print it --- -const cssChunks = join(root, "..", "..", "static", "chunks"); - -// --- fonts: inline @font-face + copy .woff2 next to the pages --- -// The Next reference never actually loads its `--font-sans/--font-mono` -// ("IBM Plex Sans"/"IBM Plex Mono"), so the extracted snapshots render with -// the system fallback. Self-host the fontsource in a `assets/fonts/` dir next -// to the HTML so the refs show the intended typefaces. - -const FONT_ASSETS_DIR = "assets/fonts"; - -// fontsource packages relative to `web/` — same weights as design2.css imports. -const FONT_SOURCES = [ - "ibm-plex-sans/400.css", - "ibm-plex-sans/500.css", - "ibm-plex-sans/600.css", - "ibm-plex-sans/700.css", - "ibm-plex-mono/400.css", - "ibm-plex-mono/500.css", -]; - -// Resolve `node_modules/@fontsource//.css`: -// 1. sibling repo dir (root `web/…` or standalone `refs/…` layouts); -// 2. upward walk from this script (monorepo with hoisted root deps). -function findFontsourceRoot() { - const here = dirname(fileURLToPath(import.meta.url)); - const candidates = [join(here, "..", "web", "node_modules", "@fontsource")]; - for (let dir = here; ; ) { - candidates.push(join(dir, "node_modules", "@fontsource")); - const parent = dirname(dir); - if (parent === dir) break; - dir = parent; - } - for (const candidate of candidates) { - if (existsSync(join(candidate, FONT_SOURCES[0]))) return candidate; - } - return null; -} - -function buildFontFaces(dest) { - const fontsource = findFontsourceRoot(); - if (!fontsource) { - console.warn("WARN: @fontsource not found (web/node_modules missing?) — skipping font embedding"); - return { style: "", copied: [] }; - } - - const seen = new Set(); - const raw = []; - for (const rel of FONT_SOURCES) { - const pkg = dirname(rel); // e.g. ibm-plex-sans - const name = basename(rel, extname(rel)); // e.g. 400.css -> 400 - const file = join(fontsource, pkg, `${name}.css`); - if (!existsSync(file)) continue; - raw.push([file, readFileSync(file, "utf8"), pkg]); - } - - // Drop duplicate @font-face blocks (each `.css` repeats across weights). - let css = raw.map(([, text]) => text.replace(/\/\*[^*]*\*\//g, "").trim()).join("\n"); - css = css.replace(/@font-face\s*\{[\s\S]*?\}/g, (block) => - seen.has(block) ? "" : (seen.add(block), block) - ); - - // Copy the woff2 files and point the css at `assets/fonts/`. Drop the woff - // entries — modern browsers only need woff2 (dev-only static snapshots). - const copied = []; - const destFonts = join(dest, FONT_ASSETS_DIR); - css = css.replace(/url\(\.\/files\/([^)]+\.woff2)\)\s*format\('woff2'\)\s*,\s*url\(\.\/files\/[^)]*\.woff\)\s*format\('woff'\)/g, (_m, f) => { - const src = (() => { - for (const [, , pkg] of raw) { - const candidate = join(fontsource, pkg, "files", f); - if (existsSync(candidate)) return candidate; - } - return null; - })(); - if (!src) { - console.warn(`WARN: font file not found: ${f}`); - return ""; - } - mkdirSync(destFonts, { recursive: true }); - writeFileSync(join(destFonts, f), readFileSync(src)); - if (!copied.includes(f)) copied.push(f); - return `url(${FONT_ASSETS_DIR}/${f}) format('woff2')`; - }); - - return { style: "", copied }; -} -const cssFile = readdirSync(cssChunks) - .filter((f) => f.endsWith(".css")) - .sort((a, b) => statSync(join(cssChunks, b)).size - statSync(join(cssChunks, a)).size)[0]; -const css = readFileSync(join(cssChunks, cssFile), "utf8"); - -const prettyCss = css - .replace(/\r/g, "") - .replace(/\{/g, " {\n ") - .replace(/;/g, ";\n ") - .replace(/\}/g, "\n}\n") - .replace(/\n{3,}/g, "\n\n") - .trim(); - -// --- conservative html formatter --- - -const VOID = new Set([ - "area", - "base", - "br", - "col", - "embed", - "hr", - "img", - "input", - "link", - "meta", - "param", - "source", - "track", - "wbr", -]); -const RAW = new Set(["pre", "textarea", "script", "style"]); - -function fmtHtml(html) { - const tokens = html.match(/|]*>|<\/?[a-zA-Z][^>]*>|[^<]+|`, "i").test(tk)) { - depth--; - rawTag = null; - } - continue; - } - - const isOpen = /^<[a-zA-Z]/.test(tk); - const isClose = /^<\//.test(tk); - let name = ""; - if (isOpen || isClose) { - name = (tk.match(/^<\/?([a-zA-Z0-9-]+)/) || [])[1]?.toLowerCase() || ""; - } - - if (isOpen && RAW.has(name)) { - out.push("\n" + " ".repeat(depth) + tk); - if (!/\/>$/.test(tk)) { - depth++; - rawTag = name; - } - } else if (isOpen && !RAW.has(name)) { - out.push("\n" + " ".repeat(depth) + tk); - if (!/\/>$/.test(tk) && !VOID.has(name)) depth++; - } else if (isClose) { - depth = Math.max(0, depth - 1); - out.push("\n" + " ".repeat(depth) + tk); - } else if (/^ !basename(rel).startsWith("_") && !basename(rel).startsWith("404")) - // `index.html` ╨╜╨░╨╝ ╨╜╨╡ ╨╜╤Г╨╢╨╡╨╜ ╨║╨░╨║ ╤А╨╡╤Д, ╨┐╨╛╤Н╤В╨╛╨╝╤Г ╨╜╨╡ ╨│╨╡╨╜╨╡╤А╨╕╤А╤Г╨╡╨╝ ╨╡╨│╨╛. - .filter((rel) => basename(rel).toLowerCase() !== "index.html") - .map((rel) => [rel, basename(rel)]); - -console.log(`discovered ${pages.length} page(s):`, pages.map((p) => p[1]).join(", ")); - -const { style: fontFacesStyle, copied: fontFiles } = buildFontFaces(dest); -if (fontFiles.length) { - console.log(`fonts: ${fontFiles.length} file(s) -> ${join(dest, FONT_ASSETS_DIR)}`); -} - -for (const [src, out] of pages) { - let html = readFileSync(join(root, src), "utf8"); - - // strip scripts — pure static snapshot - html = html.replace(//g, ""); - html = html.replace(/]+rel="preload"[^>]+as="script"[^>]*>/g, ""); - - // inline compiled css instead of linking /_next/... - html = html.replace(/]+rel="stylesheet"[^>]*>/g, () => ""); - - // fonts first, so any later @font-face overrides win for the same family - if (fontFacesStyle) html = html.replace("", "\n " + fontFacesStyle.trim()); - - html = fmtHtml(html); - html = injectThemeToggle(html); - - const file = join(dest, out); - mkdirSync(dirname(file), { recursive: true }); - writeFileSync(file, html); - console.log("written:", file); -} diff --git a/web/audit/audit-report.json b/web/audit/audit-report.json deleted file mode 100644 index 570e448..0000000 --- a/web/audit/audit-report.json +++ /dev/null @@ -1,33771 +0,0 @@ -{ - "generatedAt": "2026-08-29T05:34:12.635Z", - "reports": [ - { - "route": "/preview/demo", - "ref": "demo.html", - "deltas": [ - { - "path": "body", - "type": "style", - "tag": "body", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "2138.97px", - "ref": "1528.5px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 2139 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1529 - } - } - } - }, - { - "path": "body > main:1", - "type": "style", - "tag": "main", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "2138.97px", - "ref": "1528.5px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 2139 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1529 - } - } - } - }, - { - "path": "body > main:1 > header:1", - "type": "style", - "tag": "header", - "text": "", - "deltas": { - "padding": { - "ours": "0px 57.6px", - "ref": "0px 51.2px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 64 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "246.812px", - "ref": "231.469px" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 247, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 231, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "EP", - "deltas": { - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 30, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 30, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117.609px", - "ref": "107.766px" - }, - "height": { - "ours": "18px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 98, - "y": 23, - "w": 118, - "h": 18 - }, - "ref": { - "x": 91, - "y": 23, - "w": 108, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "/ WORKSPACE", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "79.2031px", - "ref": "73.7031px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 25, - "w": 79, - "h": 13 - }, - "ref": { - "x": 209, - "y": 26, - "w": 74, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2", - "type": "style", - "tag": "nav", - "text": "", - "deltas": { - "gap": { - "ours": "18px", - "ref": "22px" - }, - "margin": { - "ours": "0px 0px 0px 24px", - "ref": "0px 28px 0px 355.891px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "376.594px", - "ref": "296.938px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 528, - "y": 24, - "w": 377, - "h": 15 - }, - "ref": { - "x": 639, - "y": 26, - "w": 297, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:1", - "type": "style", - "tag": "a", - "text": "Workspace", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "69.125px", - "ref": "49.4844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 528, - "y": 24, - "w": 69, - "h": 15 - }, - "ref": { - "x": 639, - "y": 26, - "w": 49, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:2", - "type": "style", - "tag": "a", - "text": "Catalog", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "53.7656px", - "ref": "38.5px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 615, - "y": 24, - "w": 54, - "h": 15 - }, - "ref": { - "x": 710, - "y": 26, - "w": 39, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:3", - "type": "style", - "tag": "a", - "text": "Gradient", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.4531px", - "ref": "43.9844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 687, - "y": 24, - "w": 61, - "h": 15 - }, - "ref": { - "x": 771, - "y": 26, - "w": 44, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:4", - "type": "style", - "tag": "a", - "text": "Background remover", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "138.25px", - "ref": "98.9688px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 767, - "y": 24, - "w": 138, - "h": 15 - }, - "ref": { - "x": 837, - "y": 26, - "w": 99, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "277.812px", - "ref": "265.328px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1105, - "y": 18, - "w": 278, - "h": 28 - }, - "ref": { - "x": 963, - "y": 17, - "w": 265, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO PIPELINE", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "103.406px", - "ref": "94.875px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1105, - "y": 25, - "w": 103, - "h": 13 - }, - "ref": { - "x": 963, - "y": 26, - "w": 95, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "8px", - "ref": "6px" - }, - "height": { - "ours": "8px", - "ref": "6px" - }, - "boxShadow": { - "ours": "color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px", - "ref": "none" - }, - "rect": { - "ours": { - "x": 1105, - "y": 28, - "w": 8, - "h": 8 - }, - "ref": { - "x": 963, - "y": 29, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1224, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1074, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1230, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1080, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1268, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1119, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1274, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1125, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "70.4062px", - "ref": "64.4531px" - }, - "height": { - "ours": "27px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 1312, - "y": 18, - "w": 70, - "h": 27 - }, - "ref": { - "x": 1164, - "y": 19, - "w": 64, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:1", - "type": "style", - "tag": "button", - "text": "RU", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1313, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1165, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > span:2", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Mono\", monospace", - "ref": "\"IBM Plex Sans\", sans-serif" - }, - "fontSize": { - "ours": "10px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "6px", - "ref": "4.45312px" - }, - "height": { - "ours": "13px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1344, - "y": 25, - "w": 6, - "h": 13 - }, - "ref": { - "x": 1194, - "y": 20, - "w": 4, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:3", - "type": "style", - "tag": "button", - "text": "EN", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1350, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1199, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "508.812px 520px", - "ref": "588.844px 532.766px" - }, - "padding": { - "ours": "60px 57.6px 72px", - "ref": "60px 51.2px 72px" - }, - "margin": { - "ours": "0px 120px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1200px", - "ref": "1280px" - }, - "height": { - "ours": "2025.97px", - "ref": "1418.5px" - }, - "rect": { - "ours": { - "x": 120, - "y": 64, - "w": 1200, - "h": 2026 - }, - "ref": { - "x": 0, - "y": 64, - "w": 1280, - "h": 1419 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "970.453px", - "ref": "980.594px" - }, - "rect": { - "ours": { - "x": 178, - "y": 124, - "w": 509, - "h": 970 - }, - "ref": { - "x": 51, - "y": 124, - "w": 589, - "h": 981 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:1", - "type": "style", - "tag": "div", - "text": "PNG PROCESSING WORKSPACE", - "deltas": { - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 178, - "y": 124, - "w": 509, - "h": 13 - }, - "ref": { - "x": 51, - "y": 124, - "w": 589, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "color": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 293, - "y": 124, - "w": 7, - "h": 13 - }, - "ref": { - "x": 159, - "y": 124, - "w": 13, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "248.266px", - "ref": "169.594px" - }, - "rect": { - "ours": { - "x": 178, - "y": 155, - "w": 509, - "h": 248 - }, - "ref": { - "x": 51, - "y": 154, - "w": 589, - "h": 170 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "316.203px", - "ref": "405.062px" - }, - "height": { - "ours": "248.266px", - "ref": "169.594px" - }, - "rect": { - "ours": { - "x": 178, - "y": 155, - "w": 316, - "h": 248 - }, - "ref": { - "x": 51, - "y": 154, - "w": 405, - "h": 170 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:1 > h1:1", - "type": "style", - "tag": "h1", - "text": "Build your image pipeline.", - "deltas": { - "fontSize": { - "ours": "57.6px", - "ref": "51.2px" - }, - "lineHeight": { - "ours": "51.84px", - "ref": "51.2px" - }, - "letterSpacing": { - "ours": "-3.456px", - "ref": "-3.072px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "316.203px", - "ref": "405.062px" - }, - "height": { - "ours": "155.484px", - "ref": "102.406px" - }, - "rect": { - "ours": { - "x": 178, - "y": 155, - "w": 316, - "h": 155 - }, - "ref": { - "x": 51, - "y": 154, - "w": 405, - "h": 102 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:1 > p:2", - "type": "style", - "tag": "p", - "text": "Chain simple tools together. Every change is processed automatically and previewed at each stage.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "316.203px", - "ref": "405.062px" - }, - "height": { - "ours": "76.7812px", - "ref": "51.1875px" - }, - "rect": { - "ours": { - "x": 178, - "y": 326, - "w": 316, - "h": 77 - }, - "ref": { - "x": 51, - "y": 272, - "w": 405, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "width": { - "ours": "162.609px", - "ref": "153.781px" - }, - "rect": { - "ours": { - "x": 524, - "y": 366, - "w": 163, - "h": 37 - }, - "ref": { - "x": 486, - "y": 287, - "w": 154, - "h": 37 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 537, - "y": 377, - "w": 15, - "h": 15 - }, - "ref": { - "x": 499, - "y": 298, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "source.png", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "66px", - "ref": "60.4844px" - }, - "height": { - "ours": "14px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 560, - "y": 378, - "w": 66, - "h": 14 - }, - "ref": { - "x": 522, - "y": 299, - "w": 60, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:2 > div:2 > b:3", - "type": "style", - "tag": "b", - "text": "1.8 MB", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "39.6094px", - "ref": "36.2969px" - }, - "height": { - "ours": "14px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 634, - "y": 378, - "w": 40, - "h": 14 - }, - "ref": { - "x": 591, - "y": 299, - "w": 36, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "50px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 178, - "y": 459, - "w": 509, - "h": 50 - }, - "ref": { - "x": 51, - "y": 380, - "w": 589, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153.609px", - "ref": "148.484px" - }, - "height": { - "ours": "37px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 178, - "y": 459, - "w": 154, - "h": 37 - }, - "ref": { - "x": 51, - "y": 380, - "w": 148, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PROCESSING PIPELINE", - "deltas": { - "lineHeight": { - "ours": "12px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "1px", - "ref": "1.2px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153.609px", - "ref": "auto" - }, - "height": { - "ours": "12px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 178, - "y": 459, - "w": 154, - "h": 12 - }, - "ref": { - "x": 51, - "y": 388, - "w": 127, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "4 active steps", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153.609px", - "ref": "148.484px" - }, - "height": { - "ours": "18px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 178, - "y": 478, - "w": 154, - "h": 18 - }, - "ref": { - "x": 51, - "y": 409, - "w": 148, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > div:1 > strong:2 > em:1", - "type": "style", - "tag": "em", - "text": "• LIVE", - "deltas": { - "borderTopColor": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 295, - "y": 482, - "w": 36, - "h": 13 - }, - "ref": { - "x": 167, - "y": 413, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "Add tool", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "79.3125px", - "ref": "66.0469px" - }, - "height": { - "ours": "17px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 607, - "y": 469, - "w": 79, - "h": 17 - }, - "ref": { - "x": 574, - "y": 394, - "w": 66, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:3 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 613, - "y": 470, - "w": 15, - "h": 15 - }, - "ref": { - "x": 574, - "y": 395, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "508.812px", - "ref": "588.844px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "550.188px", - "ref": "630px" - }, - "rect": { - "ours": { - "x": 178, - "y": 509, - "w": 509, - "h": 550 - }, - "ref": { - "x": 51, - "y": 439, - "w": 589, - "h": 630 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1", - "type": "style", - "tag": "article", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "46px 460.812px", - "ref": "46px 20px 520.844px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "149px", - "ref": "152px" - }, - "rect": { - "ours": { - "x": 178, - "y": 523, - "w": 509, - "h": 149 - }, - "ref": { - "x": 51, - "y": 453, - "w": 589, - "h": 152 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:1", - "type": "style", - "tag": "div", - "text": "01", - "deltas": { - "fontSize": { - "ours": "22px", - "ref": "11px" - }, - "fontWeight": { - "ours": "600", - "ref": "400" - }, - "lineHeight": { - "ours": "22px", - "ref": "normal" - }, - "padding": { - "ours": "17px 0px 6px 15px", - "ref": "17px 0px 0px 15px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "45px", - "ref": "150px" - }, - "rect": { - "ours": { - "x": 179, - "y": 524, - "w": 46, - "h": 45 - }, - "ref": { - "x": 52, - "y": 454, - "w": 46, - "h": 150 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "margin": { - "ours": "0px", - "ref": "17px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 179, - "y": 569, - "w": 16, - "h": 16 - }, - "ref": { - "x": 98, - "y": 471, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "padding": { - "ours": "0px", - "ref": "15px 18px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "520.844px" - }, - "height": { - "ours": "147px", - "ref": "150px" - }, - "rect": { - "ours": { - "x": 225, - "y": 524, - "w": 461, - "h": 147 - }, - "ref": { - "x": 118, - "y": 454, - "w": 521, - "h": 150 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "flex-start", - "ref": "center" - }, - "gap": { - "ours": "8px", - "ref": "15px" - }, - "padding": { - "ours": "8px 12px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "72px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 225, - "y": 524, - "w": 461, - "h": 72 - }, - "ref": { - "x": 136, - "y": 469, - "w": 485, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "171px", - "ref": "156.703px" - }, - "height": { - "ours": "55px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 237, - "y": 532, - "w": 171, - "h": 55 - }, - "ref": { - "x": 136, - "y": 469, - "w": 157, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "BACKGROUND", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "171px", - "ref": "auto" - }, - "height": { - "ours": "13px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 237, - "y": 532, - "w": 171, - "h": 13 - }, - "ref": { - "x": 136, - "y": 477, - "w": 67, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:1 > h2:2", - "type": "style", - "tag": "h2", - "text": "Gradient background", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "171px", - "ref": "156.703px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 237, - "y": 550, - "w": 171, - "h": 19 - }, - "ref": { - "x": 136, - "y": 498, - "w": 157, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "8px", - "ref": "13px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "121.375px", - "ref": "97px" - }, - "height": { - "ours": "21.7812px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 552, - "y": 532, - "w": 121, - "h": 22 - }, - "ref": { - "x": 524, - "y": 493, - "w": 97, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "gap": { - "ours": "4.8px", - "ref": "4px" - }, - "padding": { - "ours": "2.4px 7.2px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "color(srgb 0.535686 0.761569 0.679216)", - "ref": "rgb(203, 211, 218)" - }, - "width": { - "ours": "60.375px", - "ref": "38px" - }, - "height": { - "ours": "21.7812px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 552, - "y": 532, - "w": 60, - "h": 22 - }, - "ref": { - "x": 524, - "y": 495, - "w": 38, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "borderTopColor": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 560, - "y": 537, - "w": 12, - "h": 12 - }, - "ref": { - "x": 524, - "y": 495, - "w": 12, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "28px", - "ref": "16px" - }, - "height": { - "ours": "18px", - "ref": "16px" - }, - "rect": { - "ours": { - "x": 620, - "y": 534, - "w": 28, - "h": 18 - }, - "ref": { - "x": 575, - "y": 493, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 626, - "y": 535, - "w": 16, - "h": 16 - }, - "ref": { - "x": 575, - "y": 493, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > svg:3", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 656, - "y": 535, - "w": 17, - "h": 17 - }, - "ref": { - "x": 604, - "y": 493, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "0px 24px", - "ref": "16px" - }, - "gridTemplateColumns": { - "ours": "137.594px 137.609px 137.609px", - "ref": "189px 119.922px 143.922px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "75px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 225, - "y": 596, - "w": 461, - "h": 75 - }, - "ref": { - "x": 136, - "y": 534, - "w": 485, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "137.594px", - "ref": "189px" - }, - "height": { - "ours": "75px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 225, - "y": 596, - "w": 138, - "h": 75 - }, - "ref": { - "x": 136, - "y": 534, - "w": 189, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > label:1", - "type": "style", - "tag": "label", - "text": "COLOR", - "deltas": { - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.594px", - "ref": "189px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 607, - "w": 138, - "h": 13 - }, - "ref": { - "x": 136, - "y": 534, - "w": 189, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "6.4px", - "ref": "8px" - }, - "padding": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.594px", - "ref": "189px" - }, - "height": { - "ours": "27.1875px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 225, - "y": 636, - "w": 138, - "h": 27 - }, - "ref": { - "x": 136, - "y": 554, - "w": 189, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "25.5938px", - "ref": "14px" - }, - "height": { - "ours": "25.5938px", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 225, - "y": 637, - "w": 26, - "h": 26 - }, - "ref": { - "x": 145, - "y": 563, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "backgroundColor": { - "ours": "rgb(238, 241, 244)", - "ref": "rgba(0, 0, 0, 0)" - }, - "padding": { - "ours": "5.6px 8px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "solid", - "ref": "none" - }, - "width": { - "ours": "85.2188px", - "ref": "127px" - }, - "height": { - "ours": "27.1875px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 257, - "y": 636, - "w": 85, - "h": 27 - }, - "ref": { - "x": 167, - "y": 563, - "w": 127, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2 > svg:3", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 348, - "y": 643, - "w": 14, - "h": 14 - }, - "ref": { - "x": 302, - "y": 563, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "0px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "137.609px", - "ref": "119.922px" - }, - "height": { - "ours": "75px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 386, - "y": 596, - "w": 138, - "h": 75 - }, - "ref": { - "x": 341, - "y": 534, - "w": 120, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > label:1", - "type": "style", - "tag": "label", - "text": "DIRECTION", - "deltas": { - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.609px", - "ref": "119.922px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 386, - "y": 607, - "w": 138, - "h": 14 - }, - "ref": { - "x": 341, - "y": 534, - "w": 120, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "135 °", - "deltas": { - "fontSize": { - "ours": "11px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "35.5px", - "ref": "31.5156px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 488, - "y": 607, - "w": 36, - "h": 14 - }, - "ref": { - "x": 430, - "y": 534, - "w": 32, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "block", - "ref": "inline-block" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.609px", - "ref": "119.922px" - }, - "rect": { - "ours": { - "x": 388, - "y": 631, - "w": 138, - "h": 16 - }, - "ref": { - "x": 341, - "y": 555, - "w": 120, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "137.609px", - "ref": "143.922px" - }, - "height": { - "ours": "75px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 548, - "y": 596, - "w": 138, - "h": 75 - }, - "ref": { - "x": 477, - "y": 534, - "w": 144, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > label:1", - "type": "style", - "tag": "label", - "text": "OPACITY", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "0.8px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 8px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.609px", - "ref": "143.922px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 548, - "y": 607, - "w": 138, - "h": 24 - }, - "ref": { - "x": 477, - "y": 534, - "w": 144, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "100%", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "0.8px" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "25.2031px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 617, - "y": 609, - "w": 44, - "h": 20 - }, - "ref": { - "x": 596, - "y": 534, - "w": 25, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(238, 241, 244)", - "ref": "rgba(0, 0, 0, 0)" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "137.609px", - "ref": "143.922px" - }, - "rect": { - "ours": { - "x": 548, - "y": 639, - "w": 138, - "h": 32 - }, - "ref": { - "x": 477, - "y": 554, - "w": 144, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:1", - "type": "style", - "tag": "button", - "text": "100", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(255, 255, 255)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "padding": { - "ours": "0px 11.2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(255, 255, 255)" - }, - "width": { - "ours": "42.1875px", - "ref": "35.4688px" - }, - "rect": { - "ours": { - "x": 549, - "y": 640, - "w": 42, - "h": 30 - }, - "ref": { - "x": 478, - "y": 555, - "w": 35, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "75", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "padding": { - "ours": "0px 11.2px", - "ref": "0px" - }, - "width": { - "ours": "36.5781px", - "ref": "35.4844px" - }, - "rect": { - "ours": { - "x": 591, - "y": 640, - "w": 37, - "h": 30 - }, - "ref": { - "x": 514, - "y": 555, - "w": 35, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:3", - "type": "style", - "tag": "button", - "text": "50", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "padding": { - "ours": "0px 11.2px", - "ref": "0px" - }, - "width": { - "ours": "36.5781px", - "ref": "35.4844px" - }, - "rect": { - "ours": { - "x": 628, - "y": 640, - "w": 37, - "h": 30 - }, - "ref": { - "x": 549, - "y": 555, - "w": 35, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:4", - "type": "style", - "tag": "button", - "text": "25", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "padding": { - "ours": "0px 11.2px", - "ref": "0px" - }, - "width": { - "ours": "36.5781px", - "ref": "35.4844px" - }, - "rect": { - "ours": { - "x": 664, - "y": 640, - "w": 37, - "h": 30 - }, - "ref": { - "x": 585, - "y": 555, - "w": 35, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2", - "type": "style", - "tag": "article", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "46px 460.812px", - "ref": "46px 20px 520.844px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "89px", - "ref": "138px" - }, - "rect": { - "ours": { - "x": 178, - "y": 682, - "w": 509, - "h": 89 - }, - "ref": { - "x": 51, - "y": 615, - "w": 589, - "h": 138 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:1", - "type": "style", - "tag": "div", - "text": "02", - "deltas": { - "fontSize": { - "ours": "22px", - "ref": "11px" - }, - "fontWeight": { - "ours": "600", - "ref": "400" - }, - "lineHeight": { - "ours": "22px", - "ref": "normal" - }, - "padding": { - "ours": "17px 0px 6px 15px", - "ref": "17px 0px 0px 15px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "45px", - "ref": "136px" - }, - "rect": { - "ours": { - "x": 179, - "y": 683, - "w": 46, - "h": 45 - }, - "ref": { - "x": 52, - "y": 616, - "w": 46, - "h": 136 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "margin": { - "ours": "0px", - "ref": "17px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 179, - "y": 728, - "w": 16, - "h": 16 - }, - "ref": { - "x": 98, - "y": 633, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "padding": { - "ours": "0px", - "ref": "15px 18px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "520.844px" - }, - "height": { - "ours": "87px", - "ref": "136px" - }, - "rect": { - "ours": { - "x": 225, - "y": 683, - "w": 461, - "h": 87 - }, - "ref": { - "x": 118, - "y": 616, - "w": 521, - "h": 136 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "flex-start", - "ref": "center" - }, - "gap": { - "ours": "8px", - "ref": "15px" - }, - "padding": { - "ours": "8px 12px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "72px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 225, - "y": 683, - "w": 461, - "h": 72 - }, - "ref": { - "x": 136, - "y": 631, - "w": 485, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153px", - "ref": "140.203px" - }, - "height": { - "ours": "55px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 237, - "y": 691, - "w": 153, - "h": 55 - }, - "ref": { - "x": 136, - "y": 631, - "w": 140, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "TRANSFORM", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153px", - "ref": "auto" - }, - "height": { - "ours": "13px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 237, - "y": 691, - "w": 153, - "h": 13 - }, - "ref": { - "x": 136, - "y": 639, - "w": 60, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:1 > h2:2", - "type": "style", - "tag": "h2", - "text": "Remove background", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "153px", - "ref": "140.203px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 237, - "y": 709, - "w": 153, - "h": 19 - }, - "ref": { - "x": 136, - "y": 660, - "w": 140, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "8px", - "ref": "13px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "121.375px", - "ref": "97px" - }, - "height": { - "ours": "21.7812px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 552, - "y": 691, - "w": 121, - "h": 22 - }, - "ref": { - "x": 524, - "y": 655, - "w": 97, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "gap": { - "ours": "4.8px", - "ref": "4px" - }, - "padding": { - "ours": "2.4px 7.2px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "color(srgb 0.535686 0.761569 0.679216)", - "ref": "rgb(203, 211, 218)" - }, - "width": { - "ours": "60.375px", - "ref": "38px" - }, - "height": { - "ours": "21.7812px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 552, - "y": 691, - "w": 60, - "h": 22 - }, - "ref": { - "x": 524, - "y": 657, - "w": 38, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "borderTopColor": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 560, - "y": 696, - "w": 12, - "h": 12 - }, - "ref": { - "x": 524, - "y": 657, - "w": 12, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "28px", - "ref": "16px" - }, - "height": { - "ours": "18px", - "ref": "16px" - }, - "rect": { - "ours": { - "x": 620, - "y": 693, - "w": 28, - "h": 18 - }, - "ref": { - "x": 575, - "y": 655, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 626, - "y": 694, - "w": 16, - "h": 16 - }, - "ref": { - "x": 575, - "y": 655, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > svg:3", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 656, - "y": 694, - "w": 17, - "h": 17 - }, - "ref": { - "x": 604, - "y": 655, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "Automatic subject detection enabled", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "rect": { - "ours": { - "x": 225, - "y": 755, - "w": 461, - "h": 15 - }, - "ref": { - "x": 136, - "y": 696, - "w": 485, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 225, - "y": 755, - "w": 15, - "h": 15 - }, - "ref": { - "x": 136, - "y": 696, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3", - "type": "style", - "tag": "article", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "46px 460.812px", - "ref": "46px 20px 520.844px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "141.188px", - "ref": "152px" - }, - "rect": { - "ours": { - "x": 178, - "y": 781, - "w": 509, - "h": 141 - }, - "ref": { - "x": 51, - "y": 763, - "w": 589, - "h": 152 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:1", - "type": "style", - "tag": "div", - "text": "03", - "deltas": { - "fontSize": { - "ours": "22px", - "ref": "11px" - }, - "fontWeight": { - "ours": "600", - "ref": "400" - }, - "lineHeight": { - "ours": "22px", - "ref": "normal" - }, - "padding": { - "ours": "17px 0px 6px 15px", - "ref": "17px 0px 0px 15px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "45px", - "ref": "150px" - }, - "rect": { - "ours": { - "x": 179, - "y": 782, - "w": 46, - "h": 45 - }, - "ref": { - "x": 52, - "y": 764, - "w": 46, - "h": 150 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "margin": { - "ours": "0px", - "ref": "17px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 179, - "y": 827, - "w": 16, - "h": 16 - }, - "ref": { - "x": 98, - "y": 781, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "padding": { - "ours": "0px", - "ref": "15px 18px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "520.844px" - }, - "height": { - "ours": "139.188px", - "ref": "150px" - }, - "rect": { - "ours": { - "x": 225, - "y": 782, - "w": 461, - "h": 139 - }, - "ref": { - "x": 118, - "y": 764, - "w": 521, - "h": 150 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "flex-start", - "ref": "center" - }, - "gap": { - "ours": "8px", - "ref": "15px" - }, - "padding": { - "ours": "8px 12px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "72px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 225, - "y": 782, - "w": 461, - "h": 72 - }, - "ref": { - "x": 136, - "y": 779, - "w": 485, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "99px", - "ref": "90.7188px" - }, - "height": { - "ours": "55px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 237, - "y": 790, - "w": 99, - "h": 55 - }, - "ref": { - "x": 136, - "y": 779, - "w": 91, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "STYLE", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "99px", - "ref": "auto" - }, - "height": { - "ours": "13px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 237, - "y": 790, - "w": 99, - "h": 13 - }, - "ref": { - "x": 136, - "y": 787, - "w": 34, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:1 > h2:2", - "type": "style", - "tag": "h2", - "text": "Add outline", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "99px", - "ref": "90.7188px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 237, - "y": 808, - "w": 99, - "h": 19 - }, - "ref": { - "x": 136, - "y": 808, - "w": 91, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "8px", - "ref": "13px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "121.375px", - "ref": "97px" - }, - "height": { - "ours": "21.7812px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 552, - "y": 790, - "w": 121, - "h": 22 - }, - "ref": { - "x": 524, - "y": 803, - "w": 97, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "gap": { - "ours": "4.8px", - "ref": "4px" - }, - "padding": { - "ours": "2.4px 7.2px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "color(srgb 0.535686 0.761569 0.679216)", - "ref": "rgb(203, 211, 218)" - }, - "width": { - "ours": "60.375px", - "ref": "38px" - }, - "height": { - "ours": "21.7812px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 552, - "y": 790, - "w": 60, - "h": 22 - }, - "ref": { - "x": 524, - "y": 805, - "w": 38, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "borderTopColor": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 560, - "y": 795, - "w": 12, - "h": 12 - }, - "ref": { - "x": 524, - "y": 805, - "w": 12, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "28px", - "ref": "16px" - }, - "height": { - "ours": "18px", - "ref": "16px" - }, - "rect": { - "ours": { - "x": 620, - "y": 792, - "w": 28, - "h": 18 - }, - "ref": { - "x": 575, - "y": 803, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 626, - "y": 793, - "w": 16, - "h": 16 - }, - "ref": { - "x": 575, - "y": 803, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > svg:3", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 656, - "y": 793, - "w": 17, - "h": 17 - }, - "ref": { - "x": 604, - "y": 803, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "0px 16px", - "ref": "16px" - }, - "gridTemplateColumns": { - "ours": "222.406px 222.406px", - "ref": "234.422px 234.422px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "67.1875px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 225, - "y": 854, - "w": 461, - "h": 67 - }, - "ref": { - "x": 136, - "y": 844, - "w": 485, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "0px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "67.1875px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 225, - "y": 854, - "w": 222, - "h": 67 - }, - "ref": { - "x": 136, - "y": 844, - "w": 234, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > label:1", - "type": "style", - "tag": "label", - "text": "WIDTH", - "deltas": { - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 865, - "w": 222, - "h": 14 - }, - "ref": { - "x": 136, - "y": 844, - "w": 234, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "2 px", - "deltas": { - "fontSize": { - "ours": "11px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "28.4062px", - "ref": "25.2188px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 419, - "y": 865, - "w": 28, - "h": 14 - }, - "ref": { - "x": 345, - "y": 844, - "w": 25, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "block", - "ref": "inline-block" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "rect": { - "ours": { - "x": 227, - "y": 889, - "w": 222, - "h": 16 - }, - "ref": { - "x": 136, - "y": 865, - "w": 234, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "67.1875px", - "ref": "52px" - }, - "rect": { - "ours": { - "x": 463, - "y": 854, - "w": 222, - "h": 67 - }, - "ref": { - "x": 387, - "y": 844, - "w": 234, - "h": 52 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > label:1", - "type": "style", - "tag": "label", - "text": "COLOR", - "deltas": { - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 463, - "y": 865, - "w": 222, - "h": 13 - }, - "ref": { - "x": 387, - "y": 844, - "w": 234, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "6.4px", - "ref": "8px" - }, - "padding": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "27.1875px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 463, - "y": 894, - "w": 222, - "h": 27 - }, - "ref": { - "x": 387, - "y": 864, - "w": 234, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "25.5938px", - "ref": "14px" - }, - "height": { - "ours": "25.5938px", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 463, - "y": 895, - "w": 26, - "h": 26 - }, - "ref": { - "x": 396, - "y": 873, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > div:2 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "backgroundColor": { - "ours": "rgb(238, 241, 244)", - "ref": "rgba(0, 0, 0, 0)" - }, - "padding": { - "ours": "5.6px 8px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "solid", - "ref": "none" - }, - "width": { - "ours": "190.422px", - "ref": "194.422px" - }, - "height": { - "ours": "27.1875px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 495, - "y": 894, - "w": 190, - "h": 27 - }, - "ref": { - "x": 418, - "y": 873, - "w": 194, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4", - "type": "style", - "tag": "article", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "46px 460.812px", - "ref": "46px 20px 520.844px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "127px", - "ref": "144px" - }, - "rect": { - "ours": { - "x": 178, - "y": 932, - "w": 509, - "h": 127 - }, - "ref": { - "x": 51, - "y": 925, - "w": 589, - "h": 144 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:1", - "type": "style", - "tag": "div", - "text": "04", - "deltas": { - "fontSize": { - "ours": "22px", - "ref": "11px" - }, - "fontWeight": { - "ours": "600", - "ref": "400" - }, - "lineHeight": { - "ours": "22px", - "ref": "normal" - }, - "padding": { - "ours": "17px 0px 6px 15px", - "ref": "17px 0px 0px 15px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "45px", - "ref": "142px" - }, - "rect": { - "ours": { - "x": 179, - "y": 933, - "w": 46, - "h": 45 - }, - "ref": { - "x": 52, - "y": 926, - "w": 46, - "h": 142 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "margin": { - "ours": "0px", - "ref": "17px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 179, - "y": 978, - "w": 16, - "h": 16 - }, - "ref": { - "x": 98, - "y": 943, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "padding": { - "ours": "0px", - "ref": "15px 18px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "520.844px" - }, - "height": { - "ours": "125px", - "ref": "142px" - }, - "rect": { - "ours": { - "x": 225, - "y": 933, - "w": 461, - "h": 125 - }, - "ref": { - "x": 118, - "y": 926, - "w": 521, - "h": 142 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "flex-start", - "ref": "center" - }, - "gap": { - "ours": "8px", - "ref": "15px" - }, - "padding": { - "ours": "8px 12px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "72px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 225, - "y": 933, - "w": 461, - "h": 72 - }, - "ref": { - "x": 136, - "y": 941, - "w": 485, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117px", - "ref": "107.219px" - }, - "height": { - "ours": "55px", - "ref": "65px" - }, - "rect": { - "ours": { - "x": 237, - "y": 941, - "w": 117, - "h": 55 - }, - "ref": { - "x": 136, - "y": 941, - "w": 107, - "h": 65 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "STYLE", - "deltas": { - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117px", - "ref": "auto" - }, - "height": { - "ours": "13px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 237, - "y": 941, - "w": 117, - "h": 13 - }, - "ref": { - "x": 136, - "y": 949, - "w": 34, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:1 > h2:2", - "type": "style", - "tag": "h2", - "text": "Round corners", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117px", - "ref": "107.219px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 237, - "y": 959, - "w": 117, - "h": 19 - }, - "ref": { - "x": 136, - "y": 970, - "w": 107, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "8px", - "ref": "13px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "121.375px", - "ref": "97px" - }, - "height": { - "ours": "21.7812px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 552, - "y": 941, - "w": 121, - "h": 22 - }, - "ref": { - "x": 524, - "y": 965, - "w": 97, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "gap": { - "ours": "4.8px", - "ref": "4px" - }, - "padding": { - "ours": "2.4px 7.2px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "color(srgb 0.535686 0.761569 0.679216)", - "ref": "rgb(203, 211, 218)" - }, - "width": { - "ours": "60.375px", - "ref": "38px" - }, - "height": { - "ours": "21.7812px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 552, - "y": 941, - "w": 60, - "h": 22 - }, - "ref": { - "x": 524, - "y": 967, - "w": 38, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "15px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "color": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(35, 131, 84)" - }, - "borderTopColor": { - "ours": "rgb(37, 169, 106)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 560, - "y": 946, - "w": 12, - "h": 12 - }, - "ref": { - "x": 524, - "y": 967, - "w": 12, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "28px", - "ref": "16px" - }, - "height": { - "ours": "18px", - "ref": "16px" - }, - "rect": { - "ours": { - "x": 620, - "y": 943, - "w": 28, - "h": 18 - }, - "ref": { - "x": 575, - "y": 965, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 626, - "y": 944, - "w": 16, - "h": 16 - }, - "ref": { - "x": 575, - "y": 965, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > svg:3", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 656, - "y": 944, - "w": 17, - "h": 17 - }, - "ref": { - "x": 604, - "y": 965, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "0px 16px", - "ref": "16px" - }, - "gridTemplateColumns": { - "ours": "222.406px 222.406px", - "ref": "234.422px 234.422px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "460.812px", - "ref": "484.844px" - }, - "height": { - "ours": "53px", - "ref": "44px" - }, - "rect": { - "ours": { - "x": 225, - "y": 1005, - "w": 461, - "h": 53 - }, - "ref": { - "x": 136, - "y": 1006, - "w": 485, - "h": 44 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "0px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "53px", - "ref": "44px" - }, - "rect": { - "ours": { - "x": 225, - "y": 1005, - "w": 222, - "h": 53 - }, - "ref": { - "x": 136, - "y": 1006, - "w": 234, - "h": 44 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > label:1", - "type": "style", - "tag": "label", - "text": "RADIUS", - "deltas": { - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "gap": { - "ours": "8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 1016, - "w": 222, - "h": 14 - }, - "ref": { - "x": 136, - "y": 1006, - "w": 234, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "18 px", - "deltas": { - "fontSize": { - "ours": "11px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.5px", - "ref": "0.8px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "35.5px", - "ref": "31.5156px" - }, - "height": { - "ours": "14px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 412, - "y": 1016, - "w": 36, - "h": 14 - }, - "ref": { - "x": 339, - "y": 1006, - "w": 32, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "block", - "ref": "inline-block" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "rect": { - "ours": { - "x": 227, - "y": 1040, - "w": 222, - "h": 16 - }, - "ref": { - "x": 136, - "y": 1027, - "w": 234, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.6px", - "ref": "16px" - }, - "lineHeight": { - "ours": "20.4px", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "alignItems": { - "ours": "center", - "ref": "normal" - }, - "justifyContent": { - "ours": "space-between", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "10px 0px 0px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "width": { - "ours": "222.406px", - "ref": "234.422px" - }, - "height": { - "ours": "53px", - "ref": "44px" - }, - "rect": { - "ours": { - "x": 463, - "y": 1005, - "w": 222, - "h": 53 - }, - "ref": { - "x": 387, - "y": 1006, - "w": 234, - "h": 44 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "Preserve aspect ratio", - "deltas": { - "fontSize": { - "ours": "13.6px", - "ref": "16px" - }, - "lineHeight": { - "ours": "20.4px", - "ref": "24px" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "129.031px", - "ref": "auto" - }, - "height": { - "ours": "20.3906px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 463, - "y": 1027, - "w": 129, - "h": 20 - }, - "ref": { - "x": 387, - "y": 1009, - "w": 156, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "block", - "ref": "inline-block" - }, - "borderRadius": { - "ours": "999px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "width": { - "ours": "38.3906px", - "ref": "32px" - }, - "height": { - "ours": "20.7969px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 647, - "y": 1027, - "w": 38, - "h": 21 - }, - "ref": { - "x": 542, - "y": 1006, - "w": 32, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > button:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderRadius": { - "ours": "50%", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16.7969px", - "ref": "auto" - }, - "height": { - "ours": "16.7969px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 667, - "y": 1029, - "w": 17, - "h": 17 - }, - "ref": { - "x": 558, - "y": 1015, - "w": 0, - "h": 0 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:5", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "508.812px", - "ref": "588.844px" - }, - "height": { - "ours": "35px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 178, - "y": 1059, - "w": 509, - "h": 35 - }, - "ref": { - "x": 51, - "y": 1069, - "w": 589, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:5 > button:1", - "type": "style", - "tag": "button", - "text": "Reset pipeline", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "width": { - "ours": "109.75px", - "ref": "97.0625px" - }, - "height": { - "ours": "17px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 178, - "y": 1077, - "w": 110, - "h": 17 - }, - "ref": { - "x": 51, - "y": 1087, - "w": 97, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:5 > button:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 184, - "y": 1079, - "w": 14, - "h": 14 - }, - "ref": { - "x": 51, - "y": 1089, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:5 > span:2", - "type": "style", - "tag": "span", - "text": "changes are applied automatically", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "233.812px", - "ref": "213.594px" - }, - "height": { - "ours": "14px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 453, - "y": 1079, - "w": 234, - "h": 14 - }, - "ref": { - "x": 426, - "y": 1089, - "w": 214, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:1 > div:5 > span:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "8px", - "ref": "6px" - }, - "height": { - "ours": "8px", - "ref": "6px" - }, - "boxShadow": { - "ours": "color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px", - "ref": "none" - }, - "rect": { - "ours": { - "x": 453, - "y": 1082, - "w": 8, - "h": 8 - }, - "ref": { - "x": 426, - "y": 1093, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "width": { - "ours": "520px", - "ref": "532.766px" - }, - "height": { - "ours": "1893.97px", - "ref": "1286.5px" - }, - "rect": { - "ours": { - "x": 742, - "y": 124, - "w": 520, - "h": 1894 - }, - "ref": { - "x": 696, - "y": 124, - "w": 533, - "h": 1287 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 12px", - "ref": "0px 0px 15px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "482px", - "ref": "494.766px" - }, - "height": { - "ours": "200.281px", - "ref": "177px" - }, - "rect": { - "ours": { - "x": 761, - "y": 143, - "w": 482, - "h": 200 - }, - "ref": { - "x": 715, - "y": 143, - "w": 495, - "h": 177 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "78.5781px", - "ref": "75.8906px" - }, - "height": { - "ours": "67px", - "ref": "87px" - }, - "rect": { - "ours": { - "x": 761, - "y": 203, - "w": 79, - "h": 67 - }, - "ref": { - "x": 715, - "y": 180, - "w": 76, - "h": 87 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PIPELINE OUTPUTS", - "deltas": { - "lineHeight": { - "ours": "12px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "1px", - "ref": "1.2px" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "78.5781px", - "ref": "auto" - }, - "height": { - "ours": "24px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 761, - "y": 203, - "w": 79, - "h": 24 - }, - "ref": { - "x": 715, - "y": 188, - "w": 54, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "Visual history", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "78.5781px", - "ref": "75.8906px" - }, - "height": { - "ours": "36px", - "ref": "34px" - }, - "rect": { - "ours": { - "x": 761, - "y": 234, - "w": 79, - "h": 36 - }, - "ref": { - "x": 715, - "y": 233, - "w": 76, - "h": 34 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "387.422px", - "ref": "418.875px" - }, - "height": { - "ours": "187.281px", - "ref": "161px" - }, - "rect": { - "ours": { - "x": 856, - "y": 143, - "w": 387, - "h": 187 - }, - "ref": { - "x": 791, - "y": 143, - "w": 419, - "h": 161 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:1", - "type": "style", - "tag": "button", - "text": "Hide intermediate", - "deltas": { - "padding": { - "ours": "11px 14px", - "ref": "8px 10px" - }, - "margin": { - "ours": "18px 0px 0px", - "ref": "0px" - }, - "width": { - "ours": "387.422px", - "ref": "145.281px" - }, - "height": { - "ours": "39px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 856, - "y": 161, - "w": 387, - "h": 39 - }, - "ref": { - "x": 1065, - "y": 143, - "w": 145, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 1101, - "y": 173, - "w": 15, - "h": 15 - }, - "ref": { - "x": 1184, - "y": 152, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "Download result", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "justifyContent": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "8px", - "ref": "9px" - }, - "padding": { - "ours": "9px 14px", - "ref": "0px" - }, - "margin": { - "ours": "0px", - "ref": "18px 0px 0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(255, 255, 255)" - }, - "borderTopStyle": { - "ours": "solid", - "ref": "none" - }, - "width": { - "ours": "191.203px", - "ref": "418.875px" - }, - "height": { - "ours": "36px", - "ref": "42px" - }, - "rect": { - "ours": { - "x": 877, - "y": 231, - "w": 191, - "h": 36 - }, - "ref": { - "x": 791, - "y": 204, - "w": 419, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 892, - "y": 241, - "w": 16, - "h": 16 - }, - "ref": { - "x": 931, - "y": 217, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:2 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 1040, - "y": 242, - "w": 14, - "h": 14 - }, - "ref": { - "x": 1056, - "y": 218, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2.4px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "78.625px 78.625px 78.625px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "164.812px", - "ref": "251.875px" - }, - "height": { - "ours": "78.2812px", - "ref": "48px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 210, - "w": 165, - "h": 78 - }, - "ref": { - "x": 919, - "y": 256, - "w": 252, - "h": 48 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "justifyContent": { - "ours": "space-between", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "5px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "78.625px" - }, - "padding": { - "ours": "4px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "164.812px", - "ref": "78.625px" - }, - "height": { - "ours": "24.5px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 210, - "w": 165, - "h": 25 - }, - "ref": { - "x": 919, - "y": 271, - "w": 79, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "DIMENSIONS", - "deltas": { - "lineHeight": { - "ours": "13.5px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.9px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "63px", - "ref": "78.625px" - }, - "height": { - "ours": "13.5px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 216, - "w": 63, - "h": 14 - }, - "ref": { - "x": 919, - "y": 271, - "w": 79, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1 > b:2", - "type": "style", - "tag": "b", - "text": "1200 × 800 px", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "16.5px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "85.8125px", - "ref": "78.625px" - }, - "height": { - "ours": "16.5px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 1158, - "y": 214, - "w": 86, - "h": 17 - }, - "ref": { - "x": 919, - "y": 291, - "w": 79, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "justifyContent": { - "ours": "space-between", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "5px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "78.625px" - }, - "padding": { - "ours": "4px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "164.812px", - "ref": "78.625px" - }, - "height": { - "ours": "24.5px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 237, - "w": 165, - "h": 25 - }, - "ref": { - "x": 1006, - "y": 271, - "w": 79, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "FORMAT", - "deltas": { - "lineHeight": { - "ours": "13.5px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.9px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "37.8125px", - "ref": "78.625px" - }, - "height": { - "ours": "13.5px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 243, - "w": 38, - "h": 14 - }, - "ref": { - "x": 1006, - "y": 271, - "w": 79, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "PNG-24", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "16.5px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "39.6094px", - "ref": "78.625px" - }, - "height": { - "ours": "16.5px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 1204, - "y": 241, - "w": 40, - "h": 17 - }, - "ref": { - "x": 1006, - "y": 291, - "w": 79, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "justifyContent": { - "ours": "space-between", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "5px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "78.625px" - }, - "padding": { - "ours": "4px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "164.812px", - "ref": "78.625px" - }, - "height": { - "ours": "24.5px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 264, - "w": 165, - "h": 25 - }, - "ref": { - "x": 1092, - "y": 271, - "w": 79, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "SIZE", - "deltas": { - "lineHeight": { - "ours": "13.5px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "0.9px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "25.2031px", - "ref": "78.625px" - }, - "height": { - "ours": "13.5px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1079, - "y": 270, - "w": 25, - "h": 14 - }, - "ref": { - "x": 1092, - "y": 271, - "w": 79, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3 > b:2", - "type": "style", - "tag": "b", - "text": "1.2 MB", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "16.5px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "39.6094px", - "ref": "78.625px" - }, - "height": { - "ours": "16.5px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 1204, - "y": 268, - "w": 40, - "h": 17 - }, - "ref": { - "x": 1092, - "y": 291, - "w": 79, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:4", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "padding": { - "ours": "1px 6px", - "ref": "6px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopStyle": { - "ours": "solid", - "ref": "none" - }, - "width": { - "ours": "32px", - "ref": "29px" - }, - "height": { - "ours": "32px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1211, - "y": 298, - "w": 32, - "h": 32 - }, - "ref": { - "x": 1181, - "y": 266, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:1 > div:2 > button:4 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1219, - "y": 306, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1187, - "y": 272, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "482px", - "ref": "241.375px 241.391px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "482px", - "ref": "494.766px" - }, - "height": { - "ours": "1627.19px", - "ref": "1043px" - }, - "rect": { - "ours": { - "x": 761, - "y": 343, - "w": 482, - "h": 1627 - }, - "ref": { - "x": 715, - "y": 320, - "w": 495, - "h": 1043 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgb(238, 241, 244)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "4.8px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "482px", - "ref": "241.375px" - }, - "height": { - "ours": "309.438px", - "ref": "329px" - }, - "rect": { - "ours": { - "x": 761, - "y": 359, - "w": 482, - "h": 309 - }, - "ref": { - "x": 715, - "y": 336, - "w": 241, - "h": 329 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(228, 232, 235)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "207.375px" - }, - "padding": { - "ours": "0px", - "ref": "16px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "276.859px", - "ref": "300px" - }, - "rect": { - "ours": { - "x": 769, - "y": 367, - "w": 467, - "h": 277 - }, - "ref": { - "x": 716, - "y": 337, - "w": 239, - "h": 300 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "373.766px", - "ref": "165.891px" - }, - "height": { - "ours": "276.859px", - "ref": "110.594px" - }, - "rect": { - "ours": { - "x": 769, - "y": 367, - "w": 374, - "h": 277 - }, - "ref": { - "x": 753, - "y": 432, - "w": 166, - "h": 111 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "width": { - "ours": "28.2031px", - "ref": "26.8594px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 942, - "y": 487, - "w": 28, - "h": 19 - }, - "ref": { - "x": 822, - "y": 470, - "w": 27, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "76.9844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 914, - "y": 511, - "w": 84, - "h": 13 - }, - "ref": { - "x": 797, - "y": 493, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "padding": { - "ours": "0px", - "ref": "8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "13px", - "ref": "27px" - }, - "rect": { - "ours": { - "x": 769, - "y": 648, - "w": 467, - "h": 13 - }, - "ref": { - "x": 716, - "y": 637, - "w": 239, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "SOURCE", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "40.8125px", - "ref": "29.7031px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 769, - "y": 648, - "w": 41, - "h": 13 - }, - "ref": { - "x": 724, - "y": 646, - "w": 30, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "original.png · 1200 × 800", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "150px", - "ref": "123.719px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1086, - "y": 648, - "w": 150, - "h": 13 - }, - "ref": { - "x": 824, - "y": 646, - "w": 124, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgb(238, 241, 244)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "4.8px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "482px", - "ref": "241.391px" - }, - "height": { - "ours": "309.438px", - "ref": "329px" - }, - "rect": { - "ours": { - "x": 761, - "y": 681, - "w": 482, - "h": 309 - }, - "ref": { - "x": 968, - "y": 336, - "w": 241, - "h": 329 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(228, 232, 235)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "207.391px" - }, - "padding": { - "ours": "0px", - "ref": "16px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.391px" - }, - "height": { - "ours": "276.859px", - "ref": "300px" - }, - "rect": { - "ours": { - "x": 769, - "y": 688, - "w": 467, - "h": 277 - }, - "ref": { - "x": 969, - "y": 337, - "w": 239, - "h": 300 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "373.766px", - "ref": "165.906px" - }, - "height": { - "ours": "276.859px", - "ref": "110.594px" - }, - "rect": { - "ours": { - "x": 769, - "y": 688, - "w": 374, - "h": 277 - }, - "ref": { - "x": 1006, - "y": 432, - "w": 166, - "h": 111 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "width": { - "ours": "28.2031px", - "ref": "26.8594px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 942, - "y": 808, - "w": 28, - "h": 19 - }, - "ref": { - "x": 1076, - "y": 470, - "w": 27, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "76.9844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 914, - "y": 832, - "w": 84, - "h": 13 - }, - "ref": { - "x": 1051, - "y": 493, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "padding": { - "ours": "0px", - "ref": "8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.391px" - }, - "height": { - "ours": "13px", - "ref": "27px" - }, - "rect": { - "ours": { - "x": 769, - "y": 970, - "w": 467, - "h": 13 - }, - "ref": { - "x": 969, - "y": 637, - "w": 239, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "STEP 01", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "47.6094px", - "ref": "34.6406px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 769, - "y": 970, - "w": 48, - "h": 13 - }, - "ref": { - "x": 977, - "y": 646, - "w": 35, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "gradient applied", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "96px", - "ref": "79.1719px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1140, - "y": 970, - "w": 96, - "h": 13 - }, - "ref": { - "x": 1122, - "y": 646, - "w": 79, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgb(238, 241, 244)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "4.8px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "482px", - "ref": "241.375px" - }, - "height": { - "ours": "309.438px", - "ref": "329px" - }, - "rect": { - "ours": { - "x": 761, - "y": 1002, - "w": 482, - "h": 309 - }, - "ref": { - "x": 715, - "y": 677, - "w": 241, - "h": 329 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(228, 232, 235)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "207.375px" - }, - "padding": { - "ours": "0px", - "ref": "16px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "276.859px", - "ref": "300px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1010, - "w": 467, - "h": 277 - }, - "ref": { - "x": 716, - "y": 678, - "w": 239, - "h": 300 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "373.766px", - "ref": "165.891px" - }, - "height": { - "ours": "276.859px", - "ref": "110.594px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1010, - "w": 374, - "h": 277 - }, - "ref": { - "x": 753, - "y": 773, - "w": 166, - "h": 111 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "width": { - "ours": "28.2031px", - "ref": "26.8594px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 942, - "y": 1129, - "w": 28, - "h": 19 - }, - "ref": { - "x": 822, - "y": 811, - "w": 27, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "76.9844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 914, - "y": 1153, - "w": 84, - "h": 13 - }, - "ref": { - "x": 797, - "y": 834, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "padding": { - "ours": "0px", - "ref": "8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "13px", - "ref": "27px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1291, - "w": 467, - "h": 13 - }, - "ref": { - "x": 716, - "y": 978, - "w": 239, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "STEP 02", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "47.6094px", - "ref": "34.6406px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1291, - "w": 48, - "h": 13 - }, - "ref": { - "x": 724, - "y": 987, - "w": 35, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "background removed", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "108px", - "ref": "89.0781px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1128, - "y": 1291, - "w": 108, - "h": 13 - }, - "ref": { - "x": 858, - "y": 987, - "w": 89, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgb(238, 241, 244)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "4.8px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "482px", - "ref": "241.391px" - }, - "height": { - "ours": "309.438px", - "ref": "329px" - }, - "rect": { - "ours": { - "x": 761, - "y": 1324, - "w": 482, - "h": 309 - }, - "ref": { - "x": 968, - "y": 677, - "w": 241, - "h": 329 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(228, 232, 235)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "207.391px" - }, - "padding": { - "ours": "0px", - "ref": "16px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.391px" - }, - "height": { - "ours": "276.859px", - "ref": "300px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1331, - "w": 467, - "h": 277 - }, - "ref": { - "x": 969, - "y": 678, - "w": 239, - "h": 300 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "373.766px", - "ref": "165.906px" - }, - "height": { - "ours": "276.859px", - "ref": "110.594px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1331, - "w": 374, - "h": 277 - }, - "ref": { - "x": 1006, - "y": 773, - "w": 166, - "h": 111 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "width": { - "ours": "28.2031px", - "ref": "26.8594px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 942, - "y": 1451, - "w": 28, - "h": 19 - }, - "ref": { - "x": 1076, - "y": 811, - "w": 27, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "76.9844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 914, - "y": 1475, - "w": 84, - "h": 13 - }, - "ref": { - "x": 1051, - "y": 834, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "padding": { - "ours": "0px", - "ref": "8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.391px" - }, - "height": { - "ours": "13px", - "ref": "27px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1613, - "w": 467, - "h": 13 - }, - "ref": { - "x": 969, - "y": 978, - "w": 239, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "STEP 03", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "47.6094px", - "ref": "34.6406px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1613, - "w": 48, - "h": 13 - }, - "ref": { - "x": 977, - "y": 987, - "w": 35, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "outline added", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "78px", - "ref": "64.3281px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1158, - "y": 1613, - "w": 78, - "h": 13 - }, - "ref": { - "x": 1136, - "y": 987, - "w": 64, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgb(238, 241, 244)" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "4.8px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px", - "ref": "0px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgb(23, 105, 210)" - }, - "width": { - "ours": "482px", - "ref": "241.375px" - }, - "height": { - "ours": "309.438px", - "ref": "329px" - }, - "rect": { - "ours": { - "x": 761, - "y": 1645, - "w": 482, - "h": 309 - }, - "ref": { - "x": 715, - "y": 1018, - "w": 241, - "h": 329 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(228, 232, 235)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "207.375px" - }, - "padding": { - "ours": "0px", - "ref": "16px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "276.859px", - "ref": "300px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1652, - "w": 467, - "h": 277 - }, - "ref": { - "x": 716, - "y": 1019, - "w": 239, - "h": 300 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "373.766px", - "ref": "165.891px" - }, - "height": { - "ours": "276.859px", - "ref": "110.594px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1652, - "w": 374, - "h": 277 - }, - "ref": { - "x": 753, - "y": 1114, - "w": 166, - "h": 111 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "width": { - "ours": "28.2031px", - "ref": "26.8594px" - }, - "height": { - "ours": "19px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 942, - "y": 1772, - "w": 28, - "h": 19 - }, - "ref": { - "x": 822, - "y": 1152, - "w": 27, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(22, 32, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "76.9844px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 914, - "y": 1796, - "w": 84, - "h": 13 - }, - "ref": { - "x": 797, - "y": 1175, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "alignItems": { - "ours": "baseline", - "ref": "normal" - }, - "padding": { - "ours": "0px", - "ref": "8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "467.219px", - "ref": "239.375px" - }, - "height": { - "ours": "13px", - "ref": "27px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1934, - "w": 467, - "h": 13 - }, - "ref": { - "x": 716, - "y": 1319, - "w": 239, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "FINAL OUTPUT", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "textTransform": { - "ours": "uppercase", - "ref": "none" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "81.6094px", - "ref": "59.3906px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 769, - "y": 1934, - "w": 82, - "h": 13 - }, - "ref": { - "x": 724, - "y": 1328, - "w": 59, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2 > b:2", - "type": "style", - "tag": "b", - "text": "ready · PNG-24", - "deltas": { - "fontSize": { - "ours": "10px", - "ref": "9px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "84px", - "ref": "69.2812px" - }, - "height": { - "ours": "13px", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 1152, - "y": 1934, - "w": 84, - "h": 13 - }, - "ref": { - "x": 878, - "y": 1328, - "w": 69, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > section:2 > p:3", - "type": "style", - "tag": "p", - "text": "Output is generated in-browser. Your files never leave this device.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "482px", - "ref": "494.766px" - }, - "rect": { - "ours": { - "x": 761, - "y": 1982, - "w": 482, - "h": 17 - }, - "ref": { - "x": 715, - "y": 1375, - "w": 495, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > footer:3", - "type": "style", - "tag": "footer", - "text": "", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "16px 57.6px", - "ref": "16px 51.2px" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "49px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 0, - "y": 2090, - "w": 1440, - "h": 49 - }, - "ref": { - "x": 0, - "y": 1483, - "w": 1280, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "142.812px", - "ref": "116.984px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 58, - "y": 2108, - "w": 143, - "h": 13 - }, - "ref": { - "x": 51, - "y": 1500, - "w": 117, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1 > b:1", - "type": "style", - "tag": "b", - "text": "v2.4.0", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "33px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 160, - "y": 2108, - "w": 41, - "h": 13 - }, - "ref": { - "x": 135, - "y": 1500, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:2", - "type": "style", - "tag": "span", - "text": "pipeline is local-only", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "162.609px", - "ref": "140.969px" - }, - "height": { - "ours": "16px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 690, - "y": 2107, - "w": 163, - "h": 16 - }, - "ref": { - "x": 612, - "y": 1500, - "w": 141, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 690, - "y": 2107, - "w": 13, - "h": 13 - }, - "ref": { - "x": 612, - "y": 1500, - "w": 13, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:3", - "type": "style", - "tag": "span", - "text": "© 2024", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "40.8125px", - "ref": "33px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1342, - "y": 2108, - "w": 41, - "h": 13 - }, - "ref": { - "x": 1196, - "y": 1500, - "w": 33, - "h": 12 - } - } - } - } - ], - "tokenDiffs": { - "light": [ - { - "key": "--danger", - "ours": "#e5484d", - "ref": "—" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ], - "dark": [ - { - "key": "--panel", - "ours": "#182129", - "ref": "#f8fafb" - }, - { - "key": "--blue", - "ours": "#54a2ff", - "ref": "#1769d2" - }, - { - "key": "--muted", - "ours": "#91a0ac", - "ref": "#6d7883" - }, - { - "key": "--background", - "ours": "#11171d", - "ref": "#eef1f4" - }, - { - "key": "--danger", - "ours": "#ff7479", - "ref": "—" - }, - { - "key": "--foreground", - "ours": "#e8eef2", - "ref": "#17212b" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--line", - "ours": "#33414c", - "ref": "#cbd3da" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ] - }, - "counts": { - "tagMismatch": 0, - "textMismatch": 0, - "added": 0, - "removed": 0, - "styleDiffs": 215, - "rectDiffs": 215, - "fieldDiffs": 1499, - "tokenLight": 10, - "tokenDark": 16 - } - }, - { - "route": "/preview/list-tools", - "ref": "list-tools.html", - "deltas": [ - { - "path": "body", - "type": "style", - "tag": "body", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "2315.59px", - "ref": "2409.98px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 2316 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 2410 - } - } - } - }, - { - "path": "body > main:1", - "type": "style", - "tag": "main", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "2315.59px", - "ref": "2409.98px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 2316 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 2410 - } - } - } - }, - { - "path": "body > main:1 > header:1", - "type": "style", - "tag": "header", - "text": "", - "deltas": { - "padding": { - "ours": "0px 57.6px", - "ref": "0px 51.2px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 64 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "232.422px", - "ref": "218.062px" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 232, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 218, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "EP", - "deltas": { - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 30, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 30, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117.609px", - "ref": "107.766px" - }, - "height": { - "ours": "18px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 98, - "y": 23, - "w": 118, - "h": 18 - }, - "ref": { - "x": 91, - "y": 23, - "w": 108, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "/ CATALOG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "64.8125px", - "ref": "60.2969px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 25, - "w": 65, - "h": 13 - }, - "ref": { - "x": 209, - "y": 26, - "w": 60, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2", - "type": "style", - "tag": "nav", - "text": "", - "deltas": { - "gap": { - "ours": "18px", - "ref": "22px" - }, - "margin": { - "ours": "0px 0px 0px 24px", - "ref": "0px 28px 0px 337.797px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "376.594px", - "ref": "296.938px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 504, - "y": 24, - "w": 377, - "h": 15 - }, - "ref": { - "x": 607, - "y": 26, - "w": 297, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:1", - "type": "style", - "tag": "a", - "text": "Workspace", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "69.125px", - "ref": "49.4844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 504, - "y": 24, - "w": 69, - "h": 15 - }, - "ref": { - "x": 607, - "y": 26, - "w": 49, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:2", - "type": "style", - "tag": "a", - "text": "Catalog", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "53.7656px", - "ref": "38.5px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 591, - "y": 24, - "w": 54, - "h": 15 - }, - "ref": { - "x": 679, - "y": 26, - "w": 39, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:3", - "type": "style", - "tag": "a", - "text": "Gradient", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.4531px", - "ref": "43.9844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 663, - "y": 24, - "w": 61, - "h": 15 - }, - "ref": { - "x": 739, - "y": 26, - "w": 44, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:4", - "type": "style", - "tag": "a", - "text": "Background remover", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "138.25px", - "ref": "98.9688px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 742, - "y": 24, - "w": 138, - "h": 15 - }, - "ref": { - "x": 805, - "y": 26, - "w": 99, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "311.812px", - "ref": "296.828px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1071, - "y": 18, - "w": 312, - "h": 28 - }, - "ref": { - "x": 932, - "y": 17, - "w": 297, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "LOCAL MODE / READY", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "137.406px", - "ref": "126.375px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1071, - "y": 25, - "w": 137, - "h": 13 - }, - "ref": { - "x": 932, - "y": 26, - "w": 126, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "8px", - "ref": "6px" - }, - "height": { - "ours": "8px", - "ref": "6px" - }, - "boxShadow": { - "ours": "color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px", - "ref": "none" - }, - "rect": { - "ours": { - "x": 1071, - "y": 28, - "w": 8, - "h": 8 - }, - "ref": { - "x": 932, - "y": 29, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1224, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1074, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1230, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1080, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1268, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1119, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1274, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1125, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "70.4062px", - "ref": "64.4531px" - }, - "height": { - "ours": "27px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 1312, - "y": 18, - "w": 70, - "h": 27 - }, - "ref": { - "x": 1164, - "y": 19, - "w": 64, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:1", - "type": "style", - "tag": "button", - "text": "RU", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1313, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1165, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > span:2", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Mono\", monospace", - "ref": "\"IBM Plex Sans\", sans-serif" - }, - "fontSize": { - "ours": "10px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "6px", - "ref": "4.45312px" - }, - "height": { - "ours": "13px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1344, - "y": 25, - "w": 6, - "h": 13 - }, - "ref": { - "x": 1194, - "y": 20, - "w": 4, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:3", - "type": "style", - "tag": "button", - "text": "EN", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1350, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1199, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "60px 57.6px 72px", - "ref": "60px 51.2px 72px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "2251.59px", - "ref": "2345.98px" - }, - "rect": { - "ours": { - "x": 0, - "y": 64, - "w": 1440, - "h": 2252 - }, - "ref": { - "x": 0, - "y": 64, - "w": 1280, - "h": 2346 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "24px", - "ref": "40px" - }, - "padding": { - "ours": "0px", - "ref": "0px 0px 42px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1324.81px", - "ref": "1177.62px" - }, - "height": { - "ours": "124.594px", - "ref": "182.984px" - }, - "rect": { - "ours": { - "x": 58, - "y": 124, - "w": 1325, - "h": 125 - }, - "ref": { - "x": 51, - "y": 124, - "w": 1178, - "h": 183 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "510.719px", - "ref": "660px" - }, - "height": { - "ours": "124.594px", - "ref": "139.984px" - }, - "rect": { - "ours": { - "x": 58, - "y": 124, - "w": 511, - "h": 125 - }, - "ref": { - "x": 51, - "y": 124, - "w": 660, - "h": 140 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "EASY-PNG-TOOLS / CATALOG", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "2.16px", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "margin": { - "ours": "0px 0px 8px", - "ref": "0px 0px 18px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "510.719px", - "ref": "660px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 58, - "y": 124, - "w": 511, - "h": 15 - }, - "ref": { - "x": 51, - "y": 124, - "w": 660, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:1 > h1:2", - "type": "style", - "tag": "h1", - "text": "Tool catalog", - "deltas": { - "fontSize": { - "ours": "32px", - "ref": "51.2px" - }, - "fontWeight": { - "ours": "700", - "ref": "650" - }, - "lineHeight": { - "ours": "48px", - "ref": "51.2px" - }, - "letterSpacing": { - "ours": "normal", - "ref": "-3.072px" - }, - "margin": { - "ours": "0px", - "ref": "12px 0px 14px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "510.719px", - "ref": "660px" - }, - "height": { - "ours": "48px", - "ref": "51.2031px" - }, - "rect": { - "ours": { - "x": 58, - "y": 147, - "w": 511, - "h": 48 - }, - "ref": { - "x": 51, - "y": 154, - "w": 660, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:1 > p:3", - "type": "style", - "tag": "p", - "text": "Focused utilities for working with PNG. Inspect, transform, and export — locally in your browser.", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "15.2px", - "ref": "14px" - }, - "lineHeight": { - "ours": "22.8px", - "ref": "22.4px" - }, - "margin": { - "ours": "8px 0px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "510.719px", - "ref": "660px" - }, - "height": { - "ours": "45.5938px", - "ref": "44.7812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 203, - "w": 511, - "h": 46 - }, - "ref": { - "x": 51, - "y": 219, - "w": 660, - "h": 45 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "16px", - "ref": "14px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "alignItems": { - "ours": "flex-end", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "14px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.2031px", - "ref": "123.625px" - }, - "height": { - "ours": "73.5938px", - "ref": "57.5938px" - }, - "rect": { - "ours": { - "x": 1321, - "y": 175, - "w": 61, - "h": 74 - }, - "ref": { - "x": 1105, - "y": 206, - "w": 124, - "h": 58 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:2 > b:1", - "type": "style", - "tag": "b", - "text": "32", - "deltas": { - "fontSize": { - "ours": "32px", - "ref": "64px" - }, - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "normal", - "ref": "57.6px" - }, - "letterSpacing": { - "ours": "normal", - "ref": "-5.12px" - }, - "textAlign": { - "ours": "start", - "ref": "right" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "38.4062px", - "ref": "60.1406px" - }, - "height": { - "ours": "42px", - "ref": "57.5938px" - }, - "rect": { - "ours": { - "x": 1344, - "y": 175, - "w": 38, - "h": 42 - }, - "ref": { - "x": 1105, - "y": 206, - "w": 60, - "h": 58 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "TOOLS AVAILABLE", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "14px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "margin": { - "ours": "5.6px 0px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.2031px", - "ref": "49.4844px" - }, - "height": { - "ours": "26px", - "ref": "28px" - }, - "rect": { - "ours": { - "x": 1321, - "y": 223, - "w": 61, - "h": 26 - }, - "ref": { - "x": 1179, - "y": 221, - "w": 49, - "h": 28 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > div:2 > span:2 > br:1", - "type": "style", - "tag": "br", - "text": "", - "deltas": { - "lineHeight": { - "ours": "normal", - "ref": "14px" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 1382, - "y": 223, - "w": 0, - "h": 13 - }, - "ref": { - "x": 1229, - "y": 222, - "w": 0, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "16px", - "ref": "24px" - }, - "padding": { - "ours": "20px 0px", - "ref": "24px 0px 42px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1324.81px", - "ref": "1177.62px" - }, - "height": { - "ours": "75px", - "ref": "108px" - }, - "rect": { - "ours": { - "x": 58, - "y": 249, - "w": 1325, - "h": 75 - }, - "ref": { - "x": 51, - "y": 307, - "w": 1178, - "h": 108 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > label:1", - "type": "style", - "tag": "label", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgb(248, 250, 251)", - "ref": "rgba(0, 0, 0, 0)" - }, - "gap": { - "ours": "8px", - "ref": "12px" - }, - "padding": { - "ours": "8px 12px", - "ref": "12px 14px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "202px", - "ref": "420px" - }, - "height": { - "ours": "35px", - "ref": "42px" - }, - "rect": { - "ours": { - "x": 58, - "y": 269, - "w": 202, - "h": 35 - }, - "ref": { - "x": 51, - "y": 331, - "w": 420, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > label:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "14.8906px" - }, - "rect": { - "ours": { - "x": 71, - "y": 278, - "w": 16, - "h": 16 - }, - "ref": { - "x": 66, - "y": 344, - "w": 15, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > label:1 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "padding": { - "ours": "1px 2px", - "ref": "0px" - }, - "width": { - "ours": "152px", - "ref": "363.109px" - }, - "height": { - "ours": "17px", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 95, - "y": 278, - "w": 152, - "h": 17 - }, - "ref": { - "x": 93, - "y": 345, - "w": 363, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gap": { - "ours": "6.4px", - "ref": "6px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "531.484px", - "ref": "480.469px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 851, - "y": 272, - "w": 531, - "h": 28 - }, - "ref": { - "x": 748, - "y": 337, - "w": 480, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 851, - "y": 279, - "w": 15, - "h": 15 - }, - "ref": { - "x": 748, - "y": 344, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "ALL", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "color": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(23, 105, 210)" - }, - "backgroundColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgba(0, 0, 0, 0)" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "41px", - "ref": "38.5px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 872, - "y": 272, - "w": 41, - "h": 28 - }, - "ref": { - "x": 769, - "y": 337, - "w": 39, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:3", - "type": "style", - "tag": "button", - "text": "CONVERT", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "67.3906px", - "ref": "60.5px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 920, - "y": 272, - "w": 67, - "h": 28 - }, - "ref": { - "x": 814, - "y": 337, - "w": 61, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:4", - "type": "style", - "tag": "button", - "text": "TRANSPARENCY", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "100.391px", - "ref": "87.9844px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 993, - "y": 272, - "w": 100, - "h": 28 - }, - "ref": { - "x": 880, - "y": 337, - "w": 88, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:5", - "type": "style", - "tag": "button", - "text": "COLOR", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "54.1875px", - "ref": "49.5px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 1100, - "y": 272, - "w": 54, - "h": 28 - }, - "ref": { - "x": 974, - "y": 337, - "w": 50, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:6", - "type": "style", - "tag": "button", - "text": "GEOMETRY", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "74px", - "ref": "65.9844px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 1161, - "y": 272, - "w": 74, - "h": 28 - }, - "ref": { - "x": 1030, - "y": 337, - "w": 66, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:7", - "type": "style", - "tag": "button", - "text": "FILTERS", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "67.3906px", - "ref": "60.5px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 1241, - "y": 272, - "w": 67, - "h": 28 - }, - "ref": { - "x": 1102, - "y": 337, - "w": 61, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:2 > button:8", - "type": "style", - "tag": "button", - "text": "ANALYZE", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "padding": { - "ours": "6.4px 9.6px", - "ref": "8px 10px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(203, 211, 218)", - "ref": "rgba(0, 0, 0, 0)" - }, - "width": { - "ours": "67.3906px", - "ref": "60.5px" - }, - "height": { - "ours": "27.7812px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 1315, - "y": 272, - "w": 67, - "h": 28 - }, - "ref": { - "x": 1168, - "y": 337, - "w": 61, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px 648.406px", - "ref": "574.812px 574.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1324.81px", - "ref": "1177.62px" - }, - "rect": { - "ours": { - "x": 58, - "y": 324, - "w": 1325, - "h": 1826 - }, - "ref": { - "x": 51, - "y": 415, - "w": 1178, - "h": 1826 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 324, - "w": 648, - "h": 610 - }, - "ref": { - "x": 51, - "y": 415, - "w": 575, - "h": 610 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 58, - "y": 324, - "w": 648, - "h": 24 - }, - "ref": { - "x": 51, - "y": 415, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "CONVERT", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "62.1719px", - "ref": "51.5781px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 58, - "y": 324, - "w": 62, - "h": 15 - }, - "ref": { - "x": 51, - "y": 415, - "w": 52, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "05 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 652, - "y": 326, - "w": 54, - "h": 13 - }, - "ref": { - "x": 571, - "y": 415, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "570px", - "ref": "584px" - }, - "rect": { - "ours": { - "x": 58, - "y": 364, - "w": 648, - "h": 570 - }, - "ref": { - "x": 51, - "y": 441, - "w": 575, - "h": 584 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 364, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 455, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 396, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 487, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 407, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 498, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 131, - "y": 398, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 478, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Convert JPG to PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 398, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 478, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Re-encode JPEG files as lossless PNG while preserving transparency.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "18px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 131, - "y": 417, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 501, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 381, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 472, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 409, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 500, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 480, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 571, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 512, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 603, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 523, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 614, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 514, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 603, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Convert WebP to PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 514, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 603, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Turn WebP images into a universal PNG format for any workflow.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 533, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 626, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 497, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 588, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 525, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 616, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 596, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 687, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 628, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 719, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 639, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 730, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 131, - "y": 630, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 710, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "PNG to Base64", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 630, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 710, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Encode an image as a base64 string for embedding in code or styles.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "18px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 131, - "y": 649, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 733, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 613, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 704, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 641, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 732, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 712, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 803, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 744, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 835, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 755, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 846, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 746, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 835, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "PNG to Data URI", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 746, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 835, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Build a complete data URI ready for HTML and CSS.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 765, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 858, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 729, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 820, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 757, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 848, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 828, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 919, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 860, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 951, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 871, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 962, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 131, - "y": 862, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 942, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Convert PNG to JPG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 862, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 942, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Composite transparency over a selected backdrop and export JPEG.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "18px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 131, - "y": 881, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 965, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:3", - "type": "style", - "tag": "span", - "text": "05", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 845, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 936, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 873, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 964, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 324, - "w": 648, - "h": 610 - }, - "ref": { - "x": 654, - "y": 415, - "w": 575, - "h": 610 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 734, - "y": 324, - "w": 648, - "h": 24 - }, - "ref": { - "x": 654, - "y": 415, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "TRANSPARENCY", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "106.562px", - "ref": "88.4219px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 734, - "y": 324, - "w": 107, - "h": 15 - }, - "ref": { - "x": 654, - "y": 415, - "w": 88, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "05 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1328, - "y": 326, - "w": 54, - "h": 13 - }, - "ref": { - "x": 1174, - "y": 415, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "570px", - "ref": "584px" - }, - "rect": { - "ours": { - "x": 734, - "y": 364, - "w": 648, - "h": 570 - }, - "ref": { - "x": 654, - "y": 441, - "w": 575, - "h": 584 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 364, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 455, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 396, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 487, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 407, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 498, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "55px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 807, - "y": 389, - "w": 488, - "h": 55 - }, - "ref": { - "x": 727, - "y": 478, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Remove background PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 389, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 478, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Remove a solid background by color, tolerance, or edge-connected regions.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 408, - "w": 488, - "h": 36 - }, - "ref": { - "x": 727, - "y": 501, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 381, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 472, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 409, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 500, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 480, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 571, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 512, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 603, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 523, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 614, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 514, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 603, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Extract alpha mask", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 514, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 603, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Turn the alpha channel into a clean black-and-white mask.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 533, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 626, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 497, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 588, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 525, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 616, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 596, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 687, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 628, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 719, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 639, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 730, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 630, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 719, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Round corners PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 630, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 719, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Clip the image corners by a precise radius percentage.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 649, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 742, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 613, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 704, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 641, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 732, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 712, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 803, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 744, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 835, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 755, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 846, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 807, - "y": 746, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 826, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Outline PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 746, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 826, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Add a colored ring around opaque content with adjustable thickness.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "18px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 807, - "y": 765, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 849, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 729, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 820, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 757, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 848, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 828, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 919, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 860, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 951, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 871, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 962, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "55px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 807, - "y": 853, - "w": 488, - "h": 55 - }, - "ref": { - "x": 727, - "y": 942, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Change PNG opacity", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 853, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 942, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Multiply the alpha channel while keeping the original colors unchanged.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 872, - "w": 488, - "h": 36 - }, - "ref": { - "x": 727, - "y": 965, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:3", - "type": "style", - "tag": "span", - "text": "05", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 845, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 936, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 873, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 964, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 990, - "w": 648, - "h": 610 - }, - "ref": { - "x": 51, - "y": 1081, - "w": 575, - "h": 610 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 58, - "y": 990, - "w": 648, - "h": 24 - }, - "ref": { - "x": 51, - "y": 1081, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "COLOR", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "44.4062px", - "ref": "36.8438px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 58, - "y": 990, - "w": 44, - "h": 15 - }, - "ref": { - "x": 51, - "y": 1081, - "w": 37, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "05 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 652, - "y": 992, - "w": 54, - "h": 13 - }, - "ref": { - "x": 571, - "y": 1081, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "570px", - "ref": "584px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1030, - "w": 648, - "h": 570 - }, - "ref": { - "x": 51, - "y": 1107, - "w": 575, - "h": 584 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1030, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1121, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1062, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1153, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1073, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1164, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "55px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1055, - "w": 488, - "h": 55 - }, - "ref": { - "x": 124, - "y": 1144, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Create gradient PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1055, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1144, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Generate a smooth transition between two colors with direction controls.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1074, - "w": 488, - "h": 36 - }, - "ref": { - "x": 124, - "y": 1167, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1047, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1138, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1075, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1166, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1146, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1237, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1178, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1269, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1189, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1280, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1180, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1269, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Grayscale PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1180, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1269, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Convert the image to luminance-based shades of gray.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1199, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1292, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1163, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1254, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1191, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1282, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1262, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1353, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1294, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1385, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1305, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1396, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1296, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1385, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Invert colors PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1296, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1385, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Invert every color channel while leaving alpha untouched.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1315, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1408, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1279, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1370, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1307, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1398, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1378, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1469, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1410, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1501, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1421, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1512, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1412, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1501, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Brightness & contrast", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1412, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1501, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Adjust brightness and contrast across a controlled range.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1431, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1524, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1395, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1486, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1423, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1514, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1494, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1585, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1526, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1617, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1537, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1628, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1528, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1617, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Temperature PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1528, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1617, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Make an image warmer or cooler with a single precise control.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1547, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1640, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:3", - "type": "style", - "tag": "span", - "text": "05", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1511, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1602, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1539, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1630, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 990, - "w": 648, - "h": 610 - }, - "ref": { - "x": 654, - "y": 1081, - "w": 575, - "h": 610 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 734, - "y": 990, - "w": 648, - "h": 24 - }, - "ref": { - "x": 654, - "y": 1081, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "GEOMETRY", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "71.0469px", - "ref": "58.9531px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 734, - "y": 990, - "w": 71, - "h": 15 - }, - "ref": { - "x": 654, - "y": 1081, - "w": 59, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "05 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1328, - "y": 992, - "w": 54, - "h": 13 - }, - "ref": { - "x": 1174, - "y": 1081, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "570px", - "ref": "584px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1030, - "w": 648, - "h": 570 - }, - "ref": { - "x": 654, - "y": 1107, - "w": 575, - "h": 584 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1030, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1121, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1062, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1153, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1073, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1164, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "55px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1055, - "w": 488, - "h": 55 - }, - "ref": { - "x": 727, - "y": 1144, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Resize PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1055, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1144, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Scale an image with bilinear interpolation and optional aspect lock.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1074, - "w": 488, - "h": 36 - }, - "ref": { - "x": 727, - "y": 1167, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1047, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1138, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1075, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1166, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1146, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1237, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1178, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1269, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1189, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1280, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1180, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1269, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Crop PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1180, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1269, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Cut a rectangular area with exact coordinates and dimensions.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1199, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1292, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1163, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1254, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1191, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1282, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1262, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1353, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1294, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1385, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1305, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1396, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1296, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1385, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Rotate PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1296, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1385, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Rotate by 90, 180, or 270 degrees without quality loss.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1315, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1408, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1279, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1370, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1307, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1398, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1378, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1469, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1410, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1501, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1421, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1512, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1412, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1501, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Flip PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1412, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1501, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Mirror the image horizontally or vertically.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1431, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1524, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1395, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1486, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1423, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1514, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1494, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1585, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1526, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1617, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1537, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1628, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1528, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1617, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Add padding to PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1528, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1617, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Expand the canvas on all sides by a chosen number of pixels.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1547, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1640, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:3", - "type": "style", - "tag": "span", - "text": "05", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1511, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1602, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1539, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1630, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1656, - "w": 648, - "h": 494 - }, - "ref": { - "x": 51, - "y": 1747, - "w": 575, - "h": 494 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1656, - "w": 648, - "h": 24 - }, - "ref": { - "x": 51, - "y": 1747, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "FILTERS", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "62.1719px", - "ref": "51.5781px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1656, - "w": 62, - "h": 15 - }, - "ref": { - "x": 51, - "y": 1747, - "w": 52, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "04 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 652, - "y": 1658, - "w": 54, - "h": 13 - }, - "ref": { - "x": 571, - "y": 1747, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "454px", - "ref": "468px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1696, - "w": 648, - "h": 454 - }, - "ref": { - "x": 51, - "y": 1773, - "w": 575, - "h": 468 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1696, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1787, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1728, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1819, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1739, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1830, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "59px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1730, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1810, - "w": 415, - "h": 59 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Blur PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1730, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1810, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Apply a fast Gaussian-style blur with transparent edge handling.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "18px", - "ref": "36px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1749, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1833, - "w": 415, - "h": 36 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1713, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1804, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1741, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1832, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1812, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 1903, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1844, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 1935, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1855, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 1946, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1846, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 1935, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Sharpen PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1846, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 1935, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Emphasize edges with an adjustable sharpening kernel.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1865, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 1958, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1829, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 1920, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1857, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 1948, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 1928, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 2019, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 1960, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 2051, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 1971, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 2062, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1962, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 2051, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Vignette PNG", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1962, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 2051, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Smoothly darken the image edges while preserving the center.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 1981, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 2074, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 1945, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 2036, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 1973, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 2064, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 58, - "y": 2044, - "w": 648, - "h": 106 - }, - "ref": { - "x": 51, - "y": 2135, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 75, - "y": 2076, - "w": 42, - "h": 42 - }, - "ref": { - "x": 68, - "y": 2167, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 86, - "y": 2087, - "w": 19, - "h": 19 - }, - "ref": { - "x": 80, - "y": 2178, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 131, - "y": 2078, - "w": 488, - "h": 37 - }, - "ref": { - "x": 124, - "y": 2167, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "JPEG artifacts", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 131, - "y": 2078, - "w": 488, - "h": 17 - }, - "ref": { - "x": 124, - "y": 2167, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Simulate low-quality JPEG recompression for testing.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 131, - "y": 2097, - "w": 488, - "h": 18 - }, - "ref": { - "x": 124, - "y": 2190, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 633, - "y": 2061, - "w": 24, - "h": 13 - }, - "ref": { - "x": 553, - "y": 2152, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 671, - "y": 2089, - "w": 16, - "h": 16 - }, - "ref": { - "x": 591, - "y": 2180, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "block" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1656, - "w": 648, - "h": 494 - }, - "ref": { - "x": 654, - "y": 1747, - "w": 575, - "h": 494 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.32px" - }, - "alignItems": { - "ours": "baseline", - "ref": "center" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "0px 0px 8px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1656, - "w": 648, - "h": 24 - }, - "ref": { - "x": 654, - "y": 1747, - "w": 575, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "ANALYZE", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "11px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "letterSpacing": { - "ours": "1.68px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "62.1719px", - "ref": "51.5781px" - }, - "height": { - "ours": "15px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1656, - "w": 62, - "h": 15 - }, - "ref": { - "x": 654, - "y": 1747, - "w": 52, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:1 > i:2", - "type": "style", - "tag": "i", - "text": "04 TOOLS", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "1.32px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "54.4062px", - "ref": "54.5625px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1328, - "y": 1658, - "w": 54, - "h": 13 - }, - "ref": { - "x": 1174, - "y": 1747, - "w": 55, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "648.406px", - "ref": "574.812px" - }, - "padding": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "height": { - "ours": "454px", - "ref": "468px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1696, - "w": 648, - "h": 454 - }, - "ref": { - "x": 654, - "y": 1773, - "w": 575, - "h": 468 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1696, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1787, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1728, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1819, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1739, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1830, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1730, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1819, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "PNG info", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1730, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1819, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Inspect dimensions, alpha presence, and unique color count.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1749, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1842, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "01", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1713, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1804, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1741, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1832, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1812, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 1903, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1844, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 1935, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1855, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 1946, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1846, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 1935, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Check grayscale", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1846, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 1935, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Report whether the image contains only shades of gray.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1865, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 1958, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:3", - "type": "style", - "tag": "span", - "text": "02", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1829, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 1920, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1857, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 1948, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 1928, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 2019, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 1960, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 2051, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 1971, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 2062, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1962, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 2051, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "Check transparency", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1962, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 2051, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Detect transparent and semi-transparent pixels.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 1981, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 2074, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:3", - "type": "style", - "tag": "span", - "text": "03", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 1945, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 2036, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 1973, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 2064, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "gridTemplateColumns": { - "ours": "42px 488.406px 24px 18px", - "ref": "42px 414.812px 24px 18px" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "648.406px", - "ref": "574.812px" - }, - "rect": { - "ours": { - "x": 734, - "y": 2044, - "w": 648, - "h": 106 - }, - "ref": { - "x": 654, - "y": 2135, - "w": 575, - "h": 106 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 751, - "y": 2076, - "w": 42, - "h": 42 - }, - "ref": { - "x": 671, - "y": 2167, - "w": 42, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 763, - "y": 2087, - "w": 19, - "h": 19 - }, - "ref": { - "x": 683, - "y": 2178, - "w": 19, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:2", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "flex", - "ref": "grid" - }, - "flexDirection": { - "ours": "column", - "ref": "row" - }, - "gap": { - "ours": "2px", - "ref": "8px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "414.812px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "37px", - "ref": "41px" - }, - "rect": { - "ours": { - "x": 807, - "y": 2078, - "w": 488, - "h": 37 - }, - "ref": { - "x": 727, - "y": 2167, - "w": 415, - "h": 41 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:2 > strong:1", - "type": "style", - "tag": "strong", - "text": "PNG orientation", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "height": { - "ours": "17px", - "ref": "15px" - }, - "rect": { - "ours": { - "x": 807, - "y": 2078, - "w": 488, - "h": 17 - }, - "ref": { - "x": 727, - "y": 2167, - "w": 415, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:2 > span:2", - "type": "style", - "tag": "span", - "text": "Classify the image as portrait, landscape, or square.", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "488.406px", - "ref": "414.812px" - }, - "rect": { - "ours": { - "x": 807, - "y": 2097, - "w": 488, - "h": 18 - }, - "ref": { - "x": 727, - "y": 2190, - "w": 415, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:3", - "type": "style", - "tag": "span", - "text": "04", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1309, - "y": 2061, - "w": 24, - "h": 13 - }, - "ref": { - "x": 1156, - "y": 2152, - "w": 24, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > svg:4", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "opacity": { - "ours": "1", - "ref": "0" - }, - "rect": { - "ours": { - "x": 1347, - "y": 2089, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1194, - "y": 2180, - "w": 16, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > footer:4", - "type": "style", - "tag": "footer", - "text": "ALL OPERATIONS RUN LOCALLY YOUR FILES NEVER LEAVE THIS DEVICE", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "flex", - "ref": "block" - }, - "gap": { - "ours": "24px", - "ref": "normal" - }, - "padding": { - "ours": "24px 0px 0px", - "ref": "20px 0px 0px" - }, - "margin": { - "ours": "56px 0px 0px", - "ref": "64px 0px 0px" - }, - "width": { - "ours": "1324.81px", - "ref": "1177.62px" - }, - "height": { - "ours": "38px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 58, - "y": 2206, - "w": 1325, - "h": 38 - }, - "ref": { - "x": 51, - "y": 2305, - "w": 1178, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > footer:4 > span:1", - "type": "style", - "tag": "span", - "text": "•", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "block", - "ref": "inline" - }, - "margin": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "6.8125px", - "ref": "auto" - }, - "height": { - "ours": "13px", - "ref": "auto" - }, - "rect": { - "ours": { - "x": 258, - "y": 2231, - "w": 7, - "h": 13 - }, - "ref": { - "x": 208, - "y": 2326, - "w": 11, - "h": 12 - } - } - } - } - ], - "tokenDiffs": { - "light": [ - { - "key": "--danger", - "ours": "#e5484d", - "ref": "—" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ], - "dark": [ - { - "key": "--panel", - "ours": "#182129", - "ref": "#f8fafb" - }, - { - "key": "--blue", - "ours": "#54a2ff", - "ref": "#1769d2" - }, - { - "key": "--muted", - "ours": "#91a0ac", - "ref": "#6d7883" - }, - { - "key": "--background", - "ours": "#11171d", - "ref": "#eef1f4" - }, - { - "key": "--danger", - "ours": "#ff7479", - "ref": "—" - }, - { - "key": "--foreground", - "ours": "#e8eef2", - "ref": "#17212b" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--line", - "ours": "#33414c", - "ref": "#cbd3da" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ] - }, - "counts": { - "tagMismatch": 0, - "textMismatch": 0, - "added": 0, - "removed": 0, - "styleDiffs": 303, - "rectDiffs": 303, - "fieldDiffs": 1638, - "tokenLight": 10, - "tokenDark": 16 - } - }, - { - "route": "/preview/tools/linear-gradient-png", - "ref": "gradient.html", - "deltas": [ - { - "path": "body", - "type": "style", - "tag": "body", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "783.875px", - "ref": "1299.36px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 784 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1299 - } - } - } - }, - { - "path": "body > main:1", - "type": "style", - "tag": "main", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "783.875px", - "ref": "1299.36px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 784 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1299 - } - } - } - }, - { - "path": "body > main:1 > header:1", - "type": "style", - "tag": "header", - "text": "", - "deltas": { - "padding": { - "ours": "0px 57.6px", - "ref": "0px 51.2px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 64 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "239.609px", - "ref": "224.766px" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 240, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 225, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "EP", - "deltas": { - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 30, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 30, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117.609px", - "ref": "107.766px" - }, - "height": { - "ours": "18px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 98, - "y": 23, - "w": 118, - "h": 18 - }, - "ref": { - "x": 91, - "y": 23, - "w": 108, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "/ GRADIENT", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "72px", - "ref": "67px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 25, - "w": 72, - "h": 13 - }, - "ref": { - "x": 209, - "y": 26, - "w": 67, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2", - "type": "style", - "tag": "nav", - "text": "", - "deltas": { - "gap": { - "ours": "18px", - "ref": "22px" - }, - "margin": { - "ours": "0px 0px 0px 24px", - "ref": "0px 28px 0px 368.891px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "376.594px", - "ref": "296.938px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 528, - "y": 24, - "w": 377, - "h": 15 - }, - "ref": { - "x": 645, - "y": 26, - "w": 297, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:1", - "type": "style", - "tag": "a", - "text": "Workspace", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "69.125px", - "ref": "49.4844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 528, - "y": 24, - "w": 69, - "h": 15 - }, - "ref": { - "x": 645, - "y": 26, - "w": 49, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:2", - "type": "style", - "tag": "a", - "text": "Catalog", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "53.7656px", - "ref": "38.5px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 615, - "y": 24, - "w": 54, - "h": 15 - }, - "ref": { - "x": 716, - "y": 26, - "w": 39, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:3", - "type": "style", - "tag": "a", - "text": "Gradient", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.4531px", - "ref": "43.9844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 687, - "y": 24, - "w": 61, - "h": 15 - }, - "ref": { - "x": 777, - "y": 26, - "w": 44, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:4", - "type": "style", - "tag": "a", - "text": "Background remover", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "138.25px", - "ref": "98.9688px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 766, - "y": 24, - "w": 138, - "h": 15 - }, - "ref": { - "x": 843, - "y": 26, - "w": 99, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "271.016px", - "ref": "259.031px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1111, - "y": 18, - "w": 271, - "h": 28 - }, - "ref": { - "x": 970, - "y": 17, - "w": 259, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "LIVE PREVIEW", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "96.6094px", - "ref": "88.5781px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1111, - "y": 25, - "w": 97, - "h": 13 - }, - "ref": { - "x": 970, - "y": 26, - "w": 89, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "8px", - "ref": "6px" - }, - "height": { - "ours": "8px", - "ref": "6px" - }, - "boxShadow": { - "ours": "color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px", - "ref": "none" - }, - "rect": { - "ours": { - "x": 1111, - "y": 28, - "w": 8, - "h": 8 - }, - "ref": { - "x": 970, - "y": 29, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1224, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1074, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1230, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1080, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1268, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1119, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1274, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1125, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "70.4062px", - "ref": "64.4531px" - }, - "height": { - "ours": "27px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 1312, - "y": 18, - "w": 70, - "h": 27 - }, - "ref": { - "x": 1164, - "y": 19, - "w": 64, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:1", - "type": "style", - "tag": "button", - "text": "RU", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1313, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1165, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > span:2", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Mono\", monospace", - "ref": "\"IBM Plex Sans\", sans-serif" - }, - "fontSize": { - "ours": "10px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "6px", - "ref": "4.45312px" - }, - "height": { - "ours": "13px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1344, - "y": 25, - "w": 6, - "h": 13 - }, - "ref": { - "x": 1194, - "y": 20, - "w": 4, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:3", - "type": "style", - "tag": "button", - "text": "EN", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1350, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1199, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "60px 51.2px 72px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "657.875px", - "ref": "1190.36px" - }, - "rect": { - "ours": { - "x": 0, - "y": 64, - "w": 1440, - "h": 658 - }, - "ref": { - "x": 0, - "y": 64, - "w": 1280, - "h": 1190 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "PNG PROCESSING SINGLE TOOL", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 64, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 51, - "y": 124, - "w": 1178, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "0px", - "ref": "0px 7px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 137, - "y": 66, - "w": 6, - "h": 20 - }, - "ref": { - "x": 159, - "y": 124, - "w": 13, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "end" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "gap": { - "ours": "normal", - "ref": "32px" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 48px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "133.438px", - "ref": "116.391px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 133 - }, - "ref": { - "x": 51, - "y": 154, - "w": 1178, - "h": 116 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "93.4375px", - "ref": "116.391px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 93 - }, - "ref": { - "x": 51, - "y": 154, - "w": 550, - "h": 116 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1 > h1:1", - "type": "style", - "tag": "h1", - "text": "Gradient background.", - "deltas": { - "fontSize": { - "ours": "32px", - "ref": "51.2px" - }, - "fontWeight": { - "ours": "700", - "ref": "650" - }, - "lineHeight": { - "ours": "48px", - "ref": "51.2px" - }, - "letterSpacing": { - "ours": "normal", - "ref": "-3.072px" - }, - "margin": { - "ours": "21.44px 0px", - "ref": "0px 0px 14px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "48px", - "ref": "51.2031px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 51, - "y": 154, - "w": 550, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1 > p:2", - "type": "style", - "tag": "p", - "text": "Create a clean, export-ready gradient with precise control over color, direction and transparency.", - "deltas": { - "lineHeight": { - "ours": "24px", - "ref": "25.6px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "16px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "24px", - "ref": "51.1875px" - }, - "rect": { - "ours": { - "x": 0, - "y": 179, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 51, - "y": 219, - "w": 550, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "LIVE PREVIEW", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "79.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 221, - "w": 106, - "h": 20 - }, - "ref": { - "x": 1149, - "y": 258, - "w": 80, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > span:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderRadius": { - "ours": "0px", - "ref": "50%" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "6px" - }, - "height": { - "ours": "auto", - "ref": "6px" - }, - "rect": { - "ours": { - "x": 0, - "y": 221, - "w": 0, - "h": 20 - }, - "ref": { - "x": 1149, - "y": 261, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "start" - }, - "gap": { - "ours": "normal", - "ref": "56px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "392.562px 729.062px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "479px", - "ref": "863.969px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 479 - }, - "ref": { - "x": 51, - "y": 318, - "w": 1178, - "h": 864 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(248, 250, 251)" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "392.562px" - }, - "height": { - "ours": "293px", - "ref": "635px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 293 - }, - "ref": { - "x": 51, - "y": 318, - "w": 393, - "h": 635 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "18px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "48px", - "ref": "83px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 52, - "y": 319, - "w": 391, - "h": 83 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "123.156px" - }, - "height": { - "ours": "24px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 337, - "w": 123, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "GRADIENT SETTINGS", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 0, - "y": 245, - "w": 158, - "h": 20 - }, - "ref": { - "x": 72, - "y": 345, - "w": 114, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "Configure output", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "123.156px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 161, - "y": 245, - "w": 127, - "h": 20 - }, - "ref": { - "x": 72, - "y": 366, - "w": 123, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "TOOL 01", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "46.8906px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 269, - "w": 62, - "h": 20 - }, - "ref": { - "x": 376, - "y": 354, - "w": 47, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "49px", - "ref": "101px" - }, - "rect": { - "ours": { - "x": 0, - "y": 291, - "w": 1440, - "h": 49 - }, - "ref": { - "x": 52, - "y": 402, - "w": 391, - "h": 101 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > label:1", - "type": "style", - "tag": "label", - "text": "GRADIENT TYPE", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "350.562px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 293, - "w": 120, - "h": 20 - }, - "ref": { - "x": 72, - "y": 424, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.562px" - }, - "height": { - "ours": "25px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 315, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 72, - "y": 448, - "w": 351, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > button:1", - "type": "style", - "tag": "button", - "text": "Linear", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "52.9219px", - "ref": "174.281px" - }, - "height": { - "ours": "24px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 0, - "y": 316, - "w": 53, - "h": 24 - }, - "ref": { - "x": 73, - "y": 449, - "w": 174, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "Radial", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "53.3281px", - "ref": "174.281px" - }, - "height": { - "ours": "24px", - "ref": "30px" - }, - "rect": { - "ours": { - "x": 53, - "y": 316, - "w": 53, - "h": 24 - }, - "ref": { - "x": 247, - "y": 449, - "w": 174, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "98px", - "ref": "129px" - }, - "rect": { - "ours": { - "x": 0, - "y": 340, - "w": 1440, - "h": 98 - }, - "ref": { - "x": 52, - "y": 503, - "w": 391, - "h": 129 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1", - "type": "style", - "tag": "label", - "text": "COLOR STOPS", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "350.562px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 342, - "w": 102, - "h": 20 - }, - "ref": { - "x": 72, - "y": 525, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "10px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.562px" - }, - "height": { - "ours": "74px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 364, - "w": 1440, - "h": 74 - }, - "ref": { - "x": 72, - "y": 549, - "w": 351, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "padding": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "167px" - }, - "height": { - "ours": "25px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 364, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 72, - "y": 549, - "w": 167, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "14px" - }, - "height": { - "ours": "auto", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 366, - "w": 0, - "h": 20 - }, - "ref": { - "x": 81, - "y": 558, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 2px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(118, 118, 118)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "inset", - "ref": "none" - }, - "width": { - "ours": "157px", - "ref": "127px" - }, - "height": { - "ours": "24px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 0, - "y": 365, - "w": 157, - "h": 24 - }, - "ref": { - "x": 103, - "y": 559, - "w": 127, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "→", - "deltas": { - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "16px" - }, - "height": { - "ours": "auto", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 0, - "y": 391, - "w": 16, - "h": 20 - }, - "ref": { - "x": 249, - "y": 553, - "w": 16, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "padding": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "167px" - }, - "height": { - "ours": "25px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 413, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 275, - "y": 549, - "w": 167, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "14px" - }, - "height": { - "ours": "auto", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 415, - "w": 0, - "h": 20 - }, - "ref": { - "x": 284, - "y": 558, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 2px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(118, 118, 118)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "inset", - "ref": "none" - }, - "width": { - "ours": "157px", - "ref": "127px" - }, - "height": { - "ours": "24px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 0, - "y": 414, - "w": 157, - "h": 24 - }, - "ref": { - "x": 306, - "y": 559, - "w": 127, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "margin": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.562px" - }, - "height": { - "ours": "0px", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 438, - "w": 1440, - "h": 0 - }, - "ref": { - "x": 72, - "y": 595, - "w": 351, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "49px", - "ref": "177px" - }, - "rect": { - "ours": { - "x": 0, - "y": 438, - "w": 1440, - "h": 49 - }, - "ref": { - "x": 52, - "y": 632, - "w": 391, - "h": 177 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1", - "type": "style", - "tag": "label", - "text": "DIRECTION", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "350.562px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 440, - "w": 129, - "h": 20 - }, - "ref": { - "x": 72, - "y": 654, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "135 °", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "32.5px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 89, - "y": 440, - "w": 40, - "h": 20 - }, - "ref": { - "x": 390, - "y": 654, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 134, - "y": 440, - "w": 129, - "h": 16 - }, - "ref": { - "x": 72, - "y": 679, - "w": 129, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "grid" - }, - "gap": { - "ours": "normal", - "ref": "6px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "83.1406px 83.1406px 83.1406px 83.1406px" - }, - "margin": { - "ours": "0px", - "ref": "14px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.562px" - }, - "height": { - "ours": "25px", - "ref": "70px" - }, - "rect": { - "ours": { - "x": 0, - "y": 462, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 72, - "y": 716, - "w": 351, - "h": 70 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:1", - "type": "style", - "tag": "button", - "text": "0° →", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "46.7188px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 463, - "w": 47, - "h": 24 - }, - "ref": { - "x": 72, - "y": 716, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "45° ↗", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "51.1406px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 47, - "y": 463, - "w": 51, - "h": 24 - }, - "ref": { - "x": 161, - "y": 716, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:3", - "type": "style", - "tag": "button", - "text": "90° ↑", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "52.3125px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 98, - "y": 463, - "w": 52, - "h": 24 - }, - "ref": { - "x": 250, - "y": 716, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:4", - "type": "style", - "tag": "button", - "text": "135° ↖", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgb(23, 33, 43)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "59.1562px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 150, - "y": 463, - "w": 59, - "h": 24 - }, - "ref": { - "x": 340, - "y": 716, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:5", - "type": "style", - "tag": "button", - "text": "180° ←", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "62.7188px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 209, - "y": 463, - "w": 63, - "h": 24 - }, - "ref": { - "x": 72, - "y": 754, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:6", - "type": "style", - "tag": "button", - "text": "225° ↙", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "59.1562px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 272, - "y": 463, - "w": 59, - "h": 24 - }, - "ref": { - "x": 161, - "y": 754, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:7", - "type": "style", - "tag": "button", - "text": "270° ↓", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "60.3125px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 331, - "y": 463, - "w": 60, - "h": 24 - }, - "ref": { - "x": 250, - "y": 754, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:8", - "type": "style", - "tag": "button", - "text": "315° ↘", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "59.1562px", - "ref": "83.1406px" - }, - "height": { - "ours": "24px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 392, - "y": 463, - "w": 59, - "h": 24 - }, - "ref": { - "x": 340, - "y": 754, - "w": 83, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "24px", - "ref": "93px" - }, - "rect": { - "ours": { - "x": 0, - "y": 487, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 52, - "y": 809, - "w": 391, - "h": 93 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1", - "type": "style", - "tag": "label", - "text": "OPACITY", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "350.562px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 489, - "w": 116, - "h": 20 - }, - "ref": { - "x": 72, - "y": 831, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "100 %", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "32.5px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 69, - "y": 489, - "w": 47, - "h": 20 - }, - "ref": { - "x": 390, - "y": 831, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 122, - "y": 489, - "w": 129, - "h": 16 - }, - "ref": { - "x": 72, - "y": 856, - "w": 129, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "16px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "390.562px" - }, - "height": { - "ours": "25px", - "ref": "50px" - }, - "rect": { - "ours": { - "x": 0, - "y": 511, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 52, - "y": 902, - "w": 391, - "h": 50 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1", - "type": "style", - "tag": "button", - "text": "Reset", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "12px" - }, - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "67.2969px", - "ref": "52.3594px" - }, - "height": { - "ours": "24px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 512, - "w": 67, - "h": 24 - }, - "ref": { - "x": 72, - "y": 918, - "w": 52, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "12px" - }, - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 8, - "y": 515, - "w": 14, - "h": 14 - }, - "ref": { - "x": 72, - "y": 920, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2", - "type": "style", - "tag": "span", - "text": "updates automatically", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "141.016px" - }, - "height": { - "ours": "auto", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 71, - "y": 513, - "w": 159, - "h": 20 - }, - "ref": { - "x": 282, - "y": 921, - "w": 141, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderRadius": { - "ours": "0px", - "ref": "50%" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "6px" - }, - "height": { - "ours": "auto", - "ref": "6px" - }, - "rect": { - "ours": { - "x": 71, - "y": 513, - "w": 0, - "h": 20 - }, - "ref": { - "x": 282, - "y": 924, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(248, 250, 251)" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "729.062px" - }, - "height": { - "ours": "186px", - "ref": "863.969px" - }, - "rect": { - "ours": { - "x": 0, - "y": 536, - "w": 1440, - "h": 186 - }, - "ref": { - "x": 500, - "y": 318, - "w": 729, - "h": 864 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "18px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "727.062px" - }, - "height": { - "ours": "49px", - "ref": "140px" - }, - "rect": { - "ours": { - "x": 0, - "y": 536, - "w": 1440, - "h": 49 - }, - "ref": { - "x": 501, - "y": 319, - "w": 727, - "h": 140 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "93.7812px" - }, - "height": { - "ours": "24px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 0, - "y": 536, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 521, - "y": 366, - "w": 94, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "OUTPUT PREVIEW", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 0, - "y": 538, - "w": 134, - "h": 20 - }, - "ref": { - "x": 521, - "y": 374, - "w": 94, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "gradient.png", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "93.7812px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 137, - "y": 538, - "w": 96, - "h": 20 - }, - "ref": { - "x": 521, - "y": 395, - "w": 94, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "flex-end" - }, - "gap": { - "ours": "normal", - "ref": "10px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "210.562px" - }, - "height": { - "ours": "25px", - "ref": "103px" - }, - "rect": { - "ours": { - "x": 0, - "y": 560, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 997, - "y": 337, - "w": 211, - "h": 103 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:1", - "type": "style", - "tag": "button", - "text": "Copy CSS", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "padding": { - "ours": "1px 6px", - "ref": "8px 6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "solid" - }, - "width": { - "ours": "91px", - "ref": "80.9844px" - }, - "height": { - "ours": "25px", - "ref": "33px" - }, - "rect": { - "ours": { - "x": 0, - "y": 560, - "w": 91, - "h": 25 - }, - "ref": { - "x": 1127, - "y": 337, - "w": 81, - "h": 33 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "10px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 8, - "y": 563, - "w": 15, - "h": 15 - }, - "ref": { - "x": 1134, - "y": 346, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "Download PNG", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline-block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "9px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "margin": { - "ours": "0px", - "ref": "18px 0px 0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "141.297px", - "ref": "210.562px" - }, - "height": { - "ours": "25px", - "ref": "42px" - }, - "rect": { - "ours": { - "x": 95, - "y": 560, - "w": 141, - "h": 25 - }, - "ref": { - "x": 997, - "y": 398, - "w": 211, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 103, - "y": 563, - "w": 15, - "h": 15 - }, - "ref": { - "x": 1043, - "y": 412, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:2", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 214, - "y": 564, - "w": 14, - "h": 14 - }, - "ref": { - "x": 1148, - "y": 412, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(32, 42, 49)" - }, - "padding": { - "ours": "0px", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "727.062px" - }, - "height": { - "ours": "48px", - "ref": "585.594px" - }, - "rect": { - "ours": { - "x": 0, - "y": 585, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 501, - "y": 459, - "w": 727, - "h": 586 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "12px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "justifyContent": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "92.375px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "679.062px" - }, - "height": { - "ours": "48px", - "ref": "537.594px" - }, - "rect": { - "ours": { - "x": 0, - "y": 585, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 525, - "y": 483, - "w": 679, - "h": 538 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "PNG", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "68px" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgba(255, 255, 255, 0.65)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "70px" - }, - "height": { - "ours": "24px", - "ref": "70px" - }, - "rect": { - "ours": { - "x": 0, - "y": 585, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 829, - "y": 704, - "w": 70, - "h": 70 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "12px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "92.375px" - }, - "height": { - "ours": "auto", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 611, - "w": 108, - "h": 20 - }, - "ref": { - "x": 818, - "y": 786, - "w": 92, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "16px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "727.062px" - }, - "height": { - "ours": "89px", - "ref": "136.375px" - }, - "rect": { - "ours": { - "x": 0, - "y": 633, - "w": 1440, - "h": 89 - }, - "ref": { - "x": 501, - "y": 1045, - "w": 727, - "h": 136 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "687.062px" - }, - "height": { - "ours": "25px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 0, - "y": 633, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 521, - "y": 1061, - "w": 687, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "GENERATED CSS", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "87.0781px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 635, - "w": 122, - "h": 20 - }, - "ref": { - "x": 521, - "y": 1068, - "w": 87, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "14px" - }, - "padding": { - "ours": "1px 6px", - "ref": "6px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "30px", - "ref": "26px" - }, - "height": { - "ours": "24px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 126, - "y": 634, - "w": 30, - "h": 24 - }, - "ref": { - "x": 1182, - "y": 1061, - "w": 26, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 134, - "y": 637, - "w": 14, - "h": 14 - }, - "ref": { - "x": 1188, - "y": 1067, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > pre:2", - "type": "style", - "tag": "pre", - "text": "background: linear-gradient(135deg, #1769D2 0%, #00A8C7 100%); opacity: 1;", - "deltas": { - "fontFamily": { - "ours": "monospace", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "12px" - }, - "lineHeight": { - "ours": "24px", - "ref": "19.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "padding": { - "ours": "0px", - "ref": "14px" - }, - "margin": { - "ours": "16px 0px", - "ref": "12px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "687.062px" - }, - "height": { - "ours": "48px", - "ref": "66.375px" - }, - "rect": { - "ours": { - "x": 0, - "y": 674, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 521, - "y": 1099, - "w": 687, - "h": 66 - } - } - } - }, - { - "path": "body > main:1 > footer:3", - "type": "style", - "tag": "footer", - "text": "", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "16px 57.6px", - "ref": "16px 51.2px" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "46px", - "ref": "45px" - }, - "rect": { - "ours": { - "x": 0, - "y": 738, - "w": 1440, - "h": 46 - }, - "ref": { - "x": 0, - "y": 1254, - "w": 1280, - "h": 45 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "142.812px", - "ref": "116.984px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 58, - "y": 755, - "w": 143, - "h": 13 - }, - "ref": { - "x": 51, - "y": 1271, - "w": 117, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1 > b:1", - "type": "style", - "tag": "b", - "text": "v2.4.0", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "33px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 160, - "y": 755, - "w": 41, - "h": 13 - }, - "ref": { - "x": 135, - "y": 1271, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:2", - "type": "style", - "tag": "span", - "text": "gradient tool · local-only", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "176.812px", - "ref": "142.953px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 683, - "y": 755, - "w": 177, - "h": 13 - }, - "ref": { - "x": 611, - "y": 1271, - "w": 143, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:3", - "type": "style", - "tag": "span", - "text": "© 2024", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "40.8125px", - "ref": "33px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1342, - "y": 755, - "w": 41, - "h": 13 - }, - "ref": { - "x": 1196, - "y": 1271, - "w": 33, - "h": 12 - } - } - } - } - ], - "tokenDiffs": { - "light": [ - { - "key": "--danger", - "ours": "#e5484d", - "ref": "—" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ], - "dark": [ - { - "key": "--panel", - "ours": "#182129", - "ref": "#f8fafb" - }, - { - "key": "--blue", - "ours": "#54a2ff", - "ref": "#1769d2" - }, - { - "key": "--muted", - "ours": "#91a0ac", - "ref": "#6d7883" - }, - { - "key": "--background", - "ours": "#11171d", - "ref": "#eef1f4" - }, - { - "key": "--danger", - "ours": "#ff7479", - "ref": "—" - }, - { - "key": "--foreground", - "ours": "#e8eef2", - "ref": "#17212b" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--line", - "ours": "#33414c", - "ref": "#cbd3da" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ] - }, - "counts": { - "tagMismatch": 0, - "textMismatch": 0, - "added": 0, - "removed": 0, - "styleDiffs": 103, - "rectDiffs": 103, - "fieldDiffs": 906, - "tokenLight": 10, - "tokenDark": 16 - } - }, - { - "route": "/preview/tools/remove-background-png", - "ref": "background-remover.html", - "deltas": [ - { - "path": "body", - "type": "style", - "tag": "body", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "862.875px", - "ref": "1049.39px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 863 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1049 - } - } - } - }, - { - "path": "body > main:1", - "type": "style", - "tag": "main", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(238, 241, 244)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "862.875px", - "ref": "1049.39px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 863 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 1049 - } - } - } - }, - { - "path": "body > main:1 > header:1", - "type": "style", - "tag": "header", - "text": "", - "deltas": { - "padding": { - "ours": "0px 57.6px", - "ref": "0px 51.2px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "rect": { - "ours": { - "x": 0, - "y": 0, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 0, - "y": 0, - "w": 1280, - "h": 64 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1", - "type": "style", - "tag": "a", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "311.609px", - "ref": "291.75px" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 312, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 292, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:1", - "type": "style", - "tag": "span", - "text": "EP", - "deltas": { - "borderTopColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 58, - "y": 17, - "w": 30, - "h": 30 - }, - "ref": { - "x": 51, - "y": 17, - "w": 30, - "h": 30 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:2", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117.609px", - "ref": "107.766px" - }, - "height": { - "ours": "18px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 98, - "y": 23, - "w": 118, - "h": 18 - }, - "ref": { - "x": 91, - "y": 23, - "w": 108, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > a:1 > span:3", - "type": "style", - "tag": "span", - "text": "/ BACKGROUND REMOVER", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 105, 210)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "144px", - "ref": "133.984px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 225, - "y": 25, - "w": 144, - "h": 13 - }, - "ref": { - "x": 209, - "y": 26, - "w": 134, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2", - "type": "style", - "tag": "nav", - "text": "", - "deltas": { - "gap": { - "ours": "18px", - "ref": "22px" - }, - "margin": { - "ours": "0px 0px 0px 24px", - "ref": "0px 28px 0px 283px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "376.594px", - "ref": "296.938px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 554, - "y": 24, - "w": 377, - "h": 15 - }, - "ref": { - "x": 626, - "y": 26, - "w": 297, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:1", - "type": "style", - "tag": "a", - "text": "Workspace", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "69.125px", - "ref": "49.4844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 554, - "y": 24, - "w": 69, - "h": 15 - }, - "ref": { - "x": 626, - "y": 26, - "w": 49, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:2", - "type": "style", - "tag": "a", - "text": "Catalog", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "53.7656px", - "ref": "38.5px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 641, - "y": 24, - "w": 54, - "h": 15 - }, - "ref": { - "x": 697, - "y": 26, - "w": 39, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:3", - "type": "style", - "tag": "a", - "text": "Gradient", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "61.4531px", - "ref": "43.9844px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 713, - "y": 24, - "w": 61, - "h": 15 - }, - "ref": { - "x": 758, - "y": 26, - "w": 44, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > nav:2 > a:4", - "type": "style", - "tag": "a", - "text": "Background remover", - "deltas": { - "fontSize": { - "ours": "12px", - "ref": "10px" - }, - "letterSpacing": { - "ours": "0.48px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "138.25px", - "ref": "98.9688px" - }, - "height": { - "ours": "15px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 792, - "y": 24, - "w": 138, - "h": 15 - }, - "ref": { - "x": 824, - "y": 26, - "w": 99, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "291.406px", - "ref": "277.938px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1091, - "y": 18, - "w": 291, - "h": 28 - }, - "ref": { - "x": 951, - "y": 17, - "w": 278, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "AUTO PROCESSING", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "117px", - "ref": "107.484px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1091, - "y": 25, - "w": 117, - "h": 13 - }, - "ref": { - "x": 951, - "y": 26, - "w": 107, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > span:1 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "8px", - "ref": "6px" - }, - "height": { - "ours": "8px", - "ref": "6px" - }, - "boxShadow": { - "ours": "color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px", - "ref": "none" - }, - "rect": { - "ours": { - "x": 1091, - "y": 28, - "w": 8, - "h": 8 - }, - "ref": { - "x": 951, - "y": 29, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1224, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1074, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1230, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1080, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3", - "type": "style", - "tag": "button", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "display": { - "ours": "flex", - "ref": "grid" - }, - "justifyContent": { - "ours": "center", - "ref": "normal" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "17px" - }, - "width": { - "ours": "28px", - "ref": "29px" - }, - "height": { - "ours": "28px", - "ref": "29px" - }, - "rect": { - "ours": { - "x": 1268, - "y": 18, - "w": 28, - "h": 28 - }, - "ref": { - "x": 1119, - "y": 17, - "w": 29, - "h": 29 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > button:3 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "16px", - "ref": "17px" - }, - "height": { - "ours": "16px", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 1274, - "y": 24, - "w": 16, - "h": 16 - }, - "ref": { - "x": 1125, - "y": 23, - "w": 17, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "borderRadius": { - "ours": "4px", - "ref": "0px" - }, - "width": { - "ours": "70.4062px", - "ref": "64.4531px" - }, - "height": { - "ours": "27px", - "ref": "26px" - }, - "rect": { - "ours": { - "x": 1312, - "y": 18, - "w": 70, - "h": 27 - }, - "ref": { - "x": 1164, - "y": 19, - "w": 64, - "h": 26 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:1", - "type": "style", - "tag": "button", - "text": "RU", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1313, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1165, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > span:2", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Mono\", monospace", - "ref": "\"IBM Plex Sans\", sans-serif" - }, - "fontSize": { - "ours": "10px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "6px", - "ref": "4.45312px" - }, - "height": { - "ours": "13px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1344, - "y": 25, - "w": 6, - "h": 13 - }, - "ref": { - "x": 1194, - "y": 20, - "w": 4, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > header:1 > div:3 > div:4 > button:3", - "type": "style", - "tag": "button", - "text": "EN", - "deltas": { - "letterSpacing": { - "ours": "0.6px", - "ref": "normal" - }, - "width": { - "ours": "31.2031px", - "ref": "29px" - }, - "height": { - "ours": "25px", - "ref": "24px" - }, - "rect": { - "ours": { - "x": 1350, - "y": 19, - "w": 31, - "h": 25 - }, - "ref": { - "x": 1199, - "y": 20, - "w": 29, - "h": 24 - } - } - } - }, - { - "path": "body > main:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "60px 51.2px 72px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "752.875px", - "ref": "940.391px" - }, - "rect": { - "ours": { - "x": 0, - "y": 64, - "w": 1440, - "h": 753 - }, - "ref": { - "x": 0, - "y": 64, - "w": 1280, - "h": 940 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "PNG PROCESSING SINGLE TOOL", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 18px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 64, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 51, - "y": 124, - "w": 1178, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "/", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "0px", - "ref": "0px 7px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 137, - "y": 66, - "w": 6, - "h": 20 - }, - "ref": { - "x": 159, - "y": 124, - "w": 13, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "end" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "gap": { - "ours": "normal", - "ref": "32px" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 48px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "133.438px", - "ref": "116.391px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 133 - }, - "ref": { - "x": 51, - "y": 154, - "w": 1178, - "h": 116 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "93.4375px", - "ref": "116.391px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 93 - }, - "ref": { - "x": 51, - "y": 154, - "w": 550, - "h": 116 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1 > h1:1", - "type": "style", - "tag": "h1", - "text": "Remove background.", - "deltas": { - "fontSize": { - "ours": "32px", - "ref": "51.2px" - }, - "fontWeight": { - "ours": "700", - "ref": "650" - }, - "lineHeight": { - "ours": "48px", - "ref": "51.2px" - }, - "letterSpacing": { - "ours": "normal", - "ref": "-3.072px" - }, - "margin": { - "ours": "21.44px 0px", - "ref": "0px 0px 14px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "48px", - "ref": "51.2031px" - }, - "rect": { - "ours": { - "x": 0, - "y": 109, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 51, - "y": 154, - "w": 550, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > div:1 > p:2", - "type": "style", - "tag": "p", - "text": "Select a background color and tune the edge detection. Changes are processed automatically in your browser.", - "deltas": { - "lineHeight": { - "ours": "24px", - "ref": "25.6px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "16px 0px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "550px" - }, - "height": { - "ours": "24px", - "ref": "51.1875px" - }, - "rect": { - "ours": { - "x": 0, - "y": 179, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 51, - "y": 219, - "w": 550, - "h": 51 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "LIVE PREVIEW", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "79.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 221, - "w": 106, - "h": 20 - }, - "ref": { - "x": 1149, - "y": 258, - "w": 80, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:2 > span:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderRadius": { - "ours": "0px", - "ref": "50%" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "6px" - }, - "height": { - "ours": "auto", - "ref": "6px" - }, - "rect": { - "ours": { - "x": 0, - "y": 221, - "w": 0, - "h": 20 - }, - "ref": { - "x": 1149, - "y": 261, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "start" - }, - "gap": { - "ours": "normal", - "ref": "56px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "360px 761.625px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "1177.62px" - }, - "height": { - "ours": "574px", - "ref": "614px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 574 - }, - "ref": { - "x": 51, - "y": 318, - "w": 1178, - "h": 614 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(248, 250, 251)" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "360px" - }, - "height": { - "ours": "357px", - "ref": "559px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 357 - }, - "ref": { - "x": 51, - "y": 318, - "w": 360, - "h": 559 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "18px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "48px", - "ref": "83px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 52, - "y": 319, - "w": 358, - "h": 83 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "146.25px" - }, - "height": { - "ours": "24px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 0, - "y": 243, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 337, - "w": 146, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "REMOVER SETTINGS", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 0, - "y": 245, - "w": 152, - "h": 20 - }, - "ref": { - "x": 72, - "y": 345, - "w": 107, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "Configure detection", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "146.25px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 156, - "y": 245, - "w": 148, - "h": 20 - }, - "ref": { - "x": 72, - "y": 366, - "w": 146, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:1 > span:2", - "type": "style", - "tag": "span", - "text": "TOOL 02", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "46.8906px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 269, - "w": 62, - "h": 20 - }, - "ref": { - "x": 343, - "y": 354, - "w": 47, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "76px", - "ref": "123px" - }, - "rect": { - "ours": { - "x": 0, - "y": 291, - "w": 1440, - "h": 76 - }, - "ref": { - "x": 52, - "y": 402, - "w": 358, - "h": 123 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > label:1", - "type": "style", - "tag": "label", - "text": "BACKGROUND COLOR", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "318px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 293, - "w": 159, - "h": 20 - }, - "ref": { - "x": 72, - "y": 424, - "w": 318, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "padding": { - "ours": "0px", - "ref": "0px 8px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "318px" - }, - "height": { - "ours": "28px", - "ref": "32px" - }, - "rect": { - "ours": { - "x": 0, - "y": 315, - "w": 1440, - "h": 28 - }, - "ref": { - "x": 72, - "y": 448, - "w": 318, - "h": 32 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "14px" - }, - "height": { - "ours": "auto", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 320, - "w": 0, - "h": 20 - }, - "ref": { - "x": 81, - "y": 457, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 2px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(118, 118, 118)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "inset", - "ref": "none" - }, - "width": { - "ours": "157px", - "ref": "135px" - }, - "height": { - "ours": "24px", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 0, - "y": 319, - "w": 157, - "h": 24 - }, - "ref": { - "x": 103, - "y": 458, - "w": 135, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > input:3", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "block" - }, - "padding": { - "ours": "1px 2px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "1px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 33, 43)" - }, - "borderTopStyle": { - "ours": "solid", - "ref": "none" - }, - "width": { - "ours": "50px", - "ref": "135px" - }, - "rect": { - "ours": { - "x": 161, - "y": 315, - "w": 50, - "h": 27 - }, - "ref": { - "x": 246, - "y": 451, - "w": 135, - "h": 27 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:3", - "type": "style", - "tag": "div", - "text": "sampled from image background", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "flex-start" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "margin": { - "ours": "0px", - "ref": "10px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "318px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 343, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 490, - "w": 318, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:2 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "9px" - }, - "height": { - "ours": "auto", - "ref": "9px" - }, - "rect": { - "ours": { - "x": 0, - "y": 345, - "w": 0, - "h": 20 - }, - "ref": { - "x": 72, - "y": 490, - "w": 9, - "h": 9 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "48px", - "ref": "115px" - }, - "rect": { - "ours": { - "x": 0, - "y": 367, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 52, - "y": 525, - "w": 358, - "h": 115 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1", - "type": "style", - "tag": "label", - "text": "COLOR SIMILARITY", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "318px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 369, - "w": 184, - "h": 20 - }, - "ref": { - "x": 72, - "y": 547, - "w": 318, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1 > output:1", - "type": "style", - "tag": "output", - "text": "72 %", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "26px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 147, - "y": 369, - "w": 38, - "h": 20 - }, - "ref": { - "x": 364, - "y": 547, - "w": 26, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > input:2", - "type": "style", - "tag": "input", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "16px" - }, - "lineHeight": { - "ours": "normal", - "ref": "24px" - }, - "color": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(23, 33, 43)" - }, - "backgroundColor": { - "ours": "rgb(255, 255, 255)", - "ref": "rgba(0, 0, 0, 0)" - }, - "margin": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(16, 16, 16)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 190, - "y": 369, - "w": 129, - "h": 16 - }, - "ref": { - "x": 72, - "y": 572, - "w": 129, - "h": 16 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "10px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "318px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 391, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 605, - "w": 318, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "strict edges", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "65.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 393, - "w": 84, - "h": 20 - }, - "ref": { - "x": 72, - "y": 605, - "w": 66, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3 > span:2", - "type": "style", - "tag": "span", - "text": "more removal", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "65.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 87, - "y": 393, - "w": 99, - "h": 20 - }, - "ref": { - "x": 324, - "y": 605, - "w": 66, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "64px", - "ref": "93px" - }, - "rect": { - "ours": { - "x": 0, - "y": 415, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 52, - "y": 640, - "w": 358, - "h": 93 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1", - "type": "style", - "tag": "label", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "318px" - }, - "height": { - "ours": "auto", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 417, - "w": 148, - "h": 20 - }, - "ref": { - "x": 72, - "y": 662, - "w": 318, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > span:1", - "type": "style", - "tag": "span", - "text": "OUTER COLOR ONLY", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "103.969px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 417, - "w": 148, - "h": 20 - }, - "ref": { - "x": 72, - "y": 665, - "w": 104, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > b:2", - "type": "style", - "tag": "b", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "32px" - }, - "height": { - "ours": "auto", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 148, - "y": 417, - "w": 0, - "h": 20 - }, - "ref": { - "x": 358, - "y": 662, - "w": 32, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:4 > p:2", - "type": "style", - "tag": "p", - "text": "Only remove connected background pixels from the edges.", - "deltas": { - "fontSize": { - "ours": "16px", - "ref": "12px" - }, - "lineHeight": { - "ours": "24px", - "ref": "18px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "16px 0px", - "ref": "8px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "318px" - }, - "height": { - "ours": "24px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 455, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 692, - "w": 318, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "padding": { - "ours": "0px", - "ref": "22px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "64px", - "ref": "93px" - }, - "rect": { - "ours": { - "x": 0, - "y": 495, - "w": 1440, - "h": 64 - }, - "ref": { - "x": 52, - "y": 733, - "w": 358, - "h": 93 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1", - "type": "style", - "tag": "label", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 12px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "318px" - }, - "height": { - "ours": "auto", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 497, - "w": 93, - "h": 20 - }, - "ref": { - "x": 72, - "y": 755, - "w": 318, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > span:1", - "type": "style", - "tag": "span", - "text": "SHOW MASK", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "58.4844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 497, - "w": 93, - "h": 20 - }, - "ref": { - "x": 72, - "y": 758, - "w": 58, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > b:2", - "type": "style", - "tag": "b", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "32px" - }, - "height": { - "ours": "auto", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 93, - "y": 497, - "w": 0, - "h": 20 - }, - "ref": { - "x": 358, - "y": 755, - "w": 32, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:5 > p:2", - "type": "style", - "tag": "p", - "text": "Preview the detected transparency mask.", - "deltas": { - "fontSize": { - "ours": "16px", - "ref": "12px" - }, - "lineHeight": { - "ours": "24px", - "ref": "18px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "margin": { - "ours": "16px 0px", - "ref": "8px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "318px" - }, - "height": { - "ours": "24px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 535, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 72, - "y": 785, - "w": 318, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "16px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "358px" - }, - "height": { - "ours": "25px", - "ref": "50px" - }, - "rect": { - "ours": { - "x": 0, - "y": 575, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 52, - "y": 826, - "w": 358, - "h": 50 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1", - "type": "style", - "tag": "button", - "text": "Reset", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "12px" - }, - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgba(0, 0, 0, 0)" - }, - "display": { - "ours": "inline-block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "67.2969px", - "ref": "52.3594px" - }, - "height": { - "ours": "24px", - "ref": "18px" - }, - "rect": { - "ours": { - "x": 0, - "y": 576, - "w": 67, - "h": 24 - }, - "ref": { - "x": 72, - "y": 842, - "w": 52, - "h": 18 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontSize": { - "ours": "13.3333px", - "ref": "12px" - }, - "lineHeight": { - "ours": "normal", - "ref": "18px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 8, - "y": 579, - "w": 14, - "h": 14 - }, - "ref": { - "x": 72, - "y": 844, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2", - "type": "style", - "tag": "span", - "text": "updates automatically", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "8px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "141.016px" - }, - "height": { - "ours": "auto", - "ref": "13px" - }, - "rect": { - "ours": { - "x": 71, - "y": 577, - "w": 159, - "h": 20 - }, - "ref": { - "x": 249, - "y": 845, - "w": 141, - "h": 13 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2 > i:1", - "type": "style", - "tag": "i", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "11px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderRadius": { - "ours": "0px", - "ref": "50%" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "6px" - }, - "height": { - "ours": "auto", - "ref": "6px" - }, - "rect": { - "ours": { - "x": 71, - "y": 577, - "w": 0, - "h": 20 - }, - "ref": { - "x": 249, - "y": 848, - "w": 6, - "h": 6 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2", - "type": "style", - "tag": "section", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(248, 250, 251)" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "761.625px" - }, - "height": { - "ours": "217px", - "ref": "614px" - }, - "rect": { - "ours": { - "x": 0, - "y": 600, - "w": 1440, - "h": 217 - }, - "ref": { - "x": 467, - "y": 318, - "w": 762, - "h": 614 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "padding": { - "ours": "0px", - "ref": "18px 20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "759.625px" - }, - "height": { - "ours": "49px", - "ref": "121px" - }, - "rect": { - "ours": { - "x": 0, - "y": 600, - "w": 1440, - "h": 49 - }, - "ref": { - "x": 468, - "y": 319, - "w": 760, - "h": 121 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "107.766px" - }, - "height": { - "ours": "24px", - "ref": "46px" - }, - "rect": { - "ours": { - "x": 0, - "y": 600, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 488, - "y": 356, - "w": 108, - "h": 46 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "SOURCE / RESULT", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "letterSpacing": { - "ours": "normal", - "ref": "1.2px" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 0, - "y": 602, - "w": 130, - "h": 20 - }, - "ref": { - "x": 488, - "y": 364, - "w": 100, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > strong:2", - "type": "style", - "tag": "strong", - "text": "comparison.png", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "margin": { - "ours": "0px", - "ref": "5px 0px 0px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "107.766px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 134, - "y": 602, - "w": 121, - "h": 20 - }, - "ref": { - "x": 488, - "y": 385, - "w": 108, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "flex-end" - }, - "gap": { - "ours": "normal", - "ref": "10px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "193.203px" - }, - "height": { - "ours": "25px", - "ref": "84px" - }, - "rect": { - "ours": { - "x": 0, - "y": 624, - "w": 1440, - "h": 25 - }, - "ref": { - "x": 1015, - "y": 337, - "w": 193, - "h": 84 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > span:1", - "type": "style", - "tag": "span", - "text": "processed", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "5px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "68.4844px" - }, - "height": { - "ours": "auto", - "ref": "14px" - }, - "rect": { - "ours": { - "x": 0, - "y": 626, - "w": 92, - "h": 20 - }, - "ref": { - "x": 1139, - "y": 337, - "w": 68, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > span:1 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(37, 169, 106)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 0, - "y": 628, - "w": 14, - "h": 14 - }, - "ref": { - "x": 1139, - "y": 337, - "w": 14, - "h": 14 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2", - "type": "style", - "tag": "button", - "text": "Download result", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "backgroundColor": { - "ours": "rgb(240, 240, 240)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline-block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "justifyContent": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "9px" - }, - "padding": { - "ours": "1px 6px", - "ref": "0px" - }, - "margin": { - "ours": "0px", - "ref": "18px 0px 0px" - }, - "borderTopWidth": { - "ours": "2px", - "ref": "0px" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "borderTopStyle": { - "ours": "outset", - "ref": "none" - }, - "width": { - "ours": "131.828px", - "ref": "193.203px" - }, - "height": { - "ours": "25px", - "ref": "42px" - }, - "rect": { - "ours": { - "x": 96, - "y": 624, - "w": 132, - "h": 25 - }, - "ref": { - "x": 1015, - "y": 379, - "w": 193, - "h": 42 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:1", - "type": "style", - "tag": "svg", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "13.3333px", - "ref": "11px" - }, - "color": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(255, 255, 255)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(0, 0, 0)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 104, - "y": 627, - "w": 15, - "h": 15 - }, - "ref": { - "x": 1054, - "y": 393, - "w": 15, - "h": 15 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "grid" - }, - "gap": { - "ours": "normal", - "ref": "18px" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "350.812px 350.812px" - }, - "padding": { - "ours": "0px", - "ref": "20px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "759.625px" - }, - "height": { - "ours": "144px", - "ref": "446px" - }, - "rect": { - "ours": { - "x": 0, - "y": 649, - "w": 1440, - "h": 144 - }, - "ref": { - "x": 468, - "y": 440, - "w": 760, - "h": 446 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "72px", - "ref": "406px" - }, - "rect": { - "ours": { - "x": 0, - "y": 649, - "w": 1440, - "h": 72 - }, - "ref": { - "x": 488, - "y": 460, - "w": 351, - "h": 406 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 10px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 649, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 488, - "y": 460, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "SOURCE", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "33px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 651, - "w": 61, - "h": 20 - }, - "ref": { - "x": 488, - "y": 460, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1 > b:2", - "type": "style", - "tag": "b", - "text": "original.png", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "65.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 61, - "y": 651, - "w": 90, - "h": 20 - }, - "ref": { - "x": 773, - "y": 460, - "w": 66, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "backgroundColor": { - "ours": "rgba(0, 0, 0, 0)", - "ref": "rgb(232, 238, 242)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "348.812px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "48px", - "ref": "384px" - }, - "rect": { - "ours": { - "x": 0, - "y": 673, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 488, - "y": 482, - "w": 351, - "h": 384 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgba(255, 255, 255, 0.85)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "258.109px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "258.109px" - }, - "height": { - "ours": "24px", - "ref": "259.75px" - }, - "rect": { - "ours": { - "x": 0, - "y": 673, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 528, - "y": 538, - "w": 271, - "h": 273 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "OBJECT", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgba(255, 255, 255, 0.85)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "46.1875px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 0, - "y": 675, - "w": 58, - "h": 20 - }, - "ref": { - "x": 640, - "y": 665, - "w": 47, - "h": 19 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "1200 × 800", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "49.4844px" - }, - "height": { - "ours": "auto", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 0, - "y": 699, - "w": 84, - "h": 20 - }, - "ref": { - "x": 779, - "y": 846, - "w": 49, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "72px", - "ref": "406px" - }, - "rect": { - "ours": { - "x": 0, - "y": 721, - "w": 1440, - "h": 72 - }, - "ref": { - "x": 857, - "y": 460, - "w": 351, - "h": 406 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "justifyContent": { - "ours": "normal", - "ref": "space-between" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 10px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "24px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 721, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 857, - "y": 460, - "w": 351, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "RESULT", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "33px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 723, - "w": 56, - "h": 20 - }, - "ref": { - "x": 857, - "y": 460, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1 > b:2", - "type": "style", - "tag": "b", - "text": "removed-bg.png", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "76.9844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 56, - "y": 723, - "w": 124, - "h": 20 - }, - "ref": { - "x": 1131, - "y": 460, - "w": 77, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "348.812px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "350.812px" - }, - "height": { - "ours": "48px", - "ref": "384px" - }, - "rect": { - "ours": { - "x": 0, - "y": 745, - "w": 1440, - "h": 48 - }, - "ref": { - "x": 857, - "y": 482, - "w": 351, - "h": 384 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > div:1", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgba(255, 255, 255, 0.85)" - }, - "display": { - "ours": "block", - "ref": "grid" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gridTemplateColumns": { - "ours": "none", - "ref": "258.109px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "258.109px" - }, - "height": { - "ours": "24px", - "ref": "259.75px" - }, - "rect": { - "ours": { - "x": 0, - "y": 745, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 903, - "y": 545, - "w": 258, - "h": 260 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > div:1 > span:1", - "type": "style", - "tag": "span", - "text": "PNG", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "14px" - }, - "fontWeight": { - "ours": "400", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgba(255, 255, 255, 0.85)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "23.0938px" - }, - "height": { - "ours": "auto", - "ref": "17px" - }, - "rect": { - "ours": { - "x": 0, - "y": 747, - "w": 32, - "h": 20 - }, - "ref": { - "x": 1021, - "y": 666, - "w": 23, - "h": 17 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > span:2", - "type": "style", - "tag": "span", - "text": "1200 × 800", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "9px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "49.4844px" - }, - "height": { - "ours": "auto", - "ref": "10px" - }, - "rect": { - "ours": { - "x": 0, - "y": 771, - "w": 84, - "h": 20 - }, - "ref": { - "x": 1147, - "y": 846, - "w": 49, - "h": 10 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3", - "type": "style", - "tag": "div", - "text": "", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "gap": { - "ours": "normal", - "ref": "24px" - }, - "padding": { - "ours": "0px", - "ref": "16px 20px" - }, - "borderTopWidth": { - "ours": "0px", - "ref": "1px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "1440px", - "ref": "759.625px" - }, - "height": { - "ours": "24px", - "ref": "45px" - }, - "rect": { - "ours": { - "x": 0, - "y": 793, - "w": 1440, - "h": 24 - }, - "ref": { - "x": 468, - "y": 886, - "w": 760, - "h": 45 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:1", - "type": "style", - "tag": "span", - "text": "FORMAT", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "77.5px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 0, - "y": 795, - "w": 125, - "h": 20 - }, - "ref": { - "x": 488, - "y": 903, - "w": 78, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:1 > b:1", - "type": "style", - "tag": "b", - "text": "PNG-24", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 0px 6px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 65, - "y": 795, - "w": 59, - "h": 20 - }, - "ref": { - "x": 533, - "y": 903, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:2", - "type": "style", - "tag": "span", - "text": "ALPHA", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "77.5px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 129, - "y": 795, - "w": 126, - "h": 20 - }, - "ref": { - "x": 590, - "y": 903, - "w": 78, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:2 > b:1", - "type": "style", - "tag": "b", - "text": "ENABLED", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 0px 6px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 182, - "y": 795, - "w": 72, - "h": 20 - }, - "ref": { - "x": 629, - "y": 903, - "w": 39, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:3", - "type": "style", - "tag": "span", - "text": "SIMILARITY", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "color": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(109, 120, 131)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "88.4844px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 258, - "y": 795, - "w": 131, - "h": 20 - }, - "ref": { - "x": 691, - "y": 903, - "w": 88, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > div:2 > div:3 > section:2 > div:3 > span:3 > b:1", - "type": "style", - "tag": "b", - "text": "72 %", - "deltas": { - "fontFamily": { - "ours": "\"IBM Plex Sans\", sans-serif", - "ref": "\"IBM Plex Mono\", monospace" - }, - "fontSize": { - "ours": "16px", - "ref": "10px" - }, - "fontWeight": { - "ours": "700", - "ref": "600" - }, - "lineHeight": { - "ours": "24px", - "ref": "normal" - }, - "margin": { - "ours": "0px", - "ref": "0px 0px 0px 6px" - }, - "borderTopColor": { - "ours": "rgb(23, 33, 43)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "rect": { - "ours": { - "x": 351, - "y": 795, - "w": 39, - "h": 20 - }, - "ref": { - "x": 758, - "y": 903, - "w": 22, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3", - "type": "style", - "tag": "footer", - "text": "", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "gap": { - "ours": "16px", - "ref": "normal" - }, - "padding": { - "ours": "16px 57.6px", - "ref": "16px 51.2px" - }, - "width": { - "ours": "1440px", - "ref": "1280px" - }, - "height": { - "ours": "46px", - "ref": "45px" - }, - "rect": { - "ours": { - "x": 0, - "y": 817, - "w": 1440, - "h": 46 - }, - "ref": { - "x": 0, - "y": 1004, - "w": 1280, - "h": 45 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1", - "type": "style", - "tag": "span", - "text": "easy-png-tools", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "142.812px", - "ref": "116.984px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 58, - "y": 834, - "w": 143, - "h": 13 - }, - "ref": { - "x": 51, - "y": 1021, - "w": 117, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:1 > b:1", - "type": "style", - "tag": "b", - "text": "v2.4.0", - "deltas": { - "fontWeight": { - "ours": "700", - "ref": "400" - }, - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "color": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(23, 105, 210)" - }, - "display": { - "ours": "inline", - "ref": "block" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "auto", - "ref": "33px" - }, - "height": { - "ours": "auto", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 160, - "y": 834, - "w": 41, - "h": 13 - }, - "ref": { - "x": 135, - "y": 1021, - "w": 33, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:2", - "type": "style", - "tag": "span", - "text": "background remover · local-only", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "210.812px", - "ref": "170.453px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 666, - "y": 834, - "w": 211, - "h": 13 - }, - "ref": { - "x": 597, - "y": 1021, - "w": 170, - "h": 12 - } - } - } - }, - { - "path": "body > main:1 > footer:3 > span:3", - "type": "style", - "tag": "span", - "text": "© 2024", - "deltas": { - "letterSpacing": { - "ours": "0.8px", - "ref": "normal" - }, - "display": { - "ours": "block", - "ref": "flex" - }, - "alignItems": { - "ours": "normal", - "ref": "center" - }, - "gap": { - "ours": "normal", - "ref": "7px" - }, - "borderTopColor": { - "ours": "rgb(109, 120, 131)", - "ref": "rgb(203, 211, 218)" - }, - "borderTopStyle": { - "ours": "none", - "ref": "solid" - }, - "width": { - "ours": "40.8125px", - "ref": "33px" - }, - "height": { - "ours": "13px", - "ref": "12px" - }, - "rect": { - "ours": { - "x": 1342, - "y": 834, - "w": 41, - "h": 13 - }, - "ref": { - "x": 1196, - "y": 1021, - "w": 33, - "h": 12 - } - } - } - } - ], - "tokenDiffs": { - "light": [ - { - "key": "--danger", - "ours": "#e5484d", - "ref": "—" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ], - "dark": [ - { - "key": "--panel", - "ours": "#182129", - "ref": "#f8fafb" - }, - { - "key": "--blue", - "ours": "#54a2ff", - "ref": "#1769d2" - }, - { - "key": "--muted", - "ours": "#91a0ac", - "ref": "#6d7883" - }, - { - "key": "--background", - "ours": "#11171d", - "ref": "#eef1f4" - }, - { - "key": "--danger", - "ours": "#ff7479", - "ref": "—" - }, - { - "key": "--foreground", - "ours": "#e8eef2", - "ref": "#17212b" - }, - { - "key": "--success", - "ours": "#25a96a", - "ref": "—" - }, - { - "key": "--line", - "ours": "#33414c", - "ref": "#cbd3da" - }, - { - "key": "--text-sm--line-height", - "ours": "—", - "ref": "calc(1.25 / .875)" - }, - { - "key": "--text-xs--line-height", - "ours": "—", - "ref": "calc(1 / .75)" - }, - { - "key": "--font-weight-medium", - "ours": "—", - "ref": "500" - }, - { - "key": "--spacing", - "ours": "—", - "ref": ".25rem" - }, - { - "key": "--text-xs", - "ours": "—", - "ref": ".75rem" - }, - { - "key": "--radius-md", - "ours": "—", - "ref": ".375rem" - }, - { - "key": "--radius-lg", - "ours": "—", - "ref": ".5rem" - }, - { - "key": "--text-sm", - "ours": "—", - "ref": ".875rem" - } - ] - }, - "counts": { - "tagMismatch": 0, - "textMismatch": 0, - "added": 0, - "removed": 0, - "styleDiffs": 108, - "rectDiffs": 108, - "fieldDiffs": 965, - "tokenLight": 10, - "tokenDark": 16 - } - } - ] -} \ No newline at end of file diff --git a/web/audit/audit-report.md b/web/audit/audit-report.md deleted file mode 100644 index d7c8010..0000000 --- a/web/audit/audit-report.md +++ /dev/null @@ -1,5364 +0,0 @@ -# CSS audit (phase B) - -_2026-08-29T05:34:12.653Z_ - -## Сводка - -| route | ref | tokL | tokD | style (el) | fields | rect | +struct | -struct | tag | text | -|---|---|---|---|---|---|---|---|---|---|---| -| `/preview/demo` | demo.html | 10 | 16 | 215 | 1499 | 215 | 0 | 0 | 0 | 0 | -| `/preview/list-tools` | list-tools.html | 10 | 16 | 303 | 1638 | 303 | 0 | 0 | 0 | 0 | -| `/preview/tools/linear-gradient-png` | gradient.html | 10 | 16 | 103 | 906 | 103 | 0 | 0 | 0 | 0 | -| `/preview/tools/remove-background-png` | background-remover.html | 10 | 16 | 108 | 965 | 108 | 0 | 0 | 0 | 0 | - -## /preview/demo (vs demo.html) - -- Токены light: **10**, dark: **16** -- Стиль-расхождений: **215** элементов / **1499** полей (из них геометрия: 215) -- Структурные: +0 / -0 / tag 0 / text 0 - -### Токены — Light - -| token | ours | ref | -|---|---|---| -| `--danger` | #e5484d | — | -| `--success` | #25a96a | — | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Токены — Dark - -| token | ours | ref | -|---|---|---| -| `--panel` | #182129 | #f8fafb | -| `--blue` | #54a2ff | #1769d2 | -| `--muted` | #91a0ac | #6d7883 | -| `--background` | #11171d | #eef1f4 | -| `--danger` | #ff7479 | — | -| `--foreground` | #e8eef2 | #17212b | -| `--success` | #25a96a | — | -| `--line` | #33414c | #cbd3da | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Расхождения стилей (топ 150) - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > label:1` — "OPACITY" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `0.8px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 8px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.609px` → `143.922px` - - **height**: `24px` → `12px` - - **rect**: `548,607 138x24` → `477,534 144x12` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > button:2` — "Download result" - - **fontSize**: `12px` → `11px` - - **letterSpacing**: `0.48px` → `normal` - - **justifyContent**: `normal` → `center` - - **gap**: `8px` → `9px` - - **padding**: `9px 14px` → `0px` - - **margin**: `0px` → `18px 0px 0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(255, 255, 255)` - - **borderTopStyle**: `solid` → `none` - - **width**: `191.203px` → `418.875px` - - **height**: `36px` → `42px` - - **rect**: `877,231 191x36` → `791,204 419x42` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > button:4` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **padding**: `1px 6px` → `6px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgb(109, 120, 131)` - - **borderTopStyle**: `solid` → `none` - - **width**: `32px` → `29px` - - **height**: `32px` → `29px` - - **rect**: `1211,298 32x32` → `1181,266 29x29` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > span:1` — "AUTO" - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **gap**: `4.8px` → `4px` - - **padding**: `2.4px 7.2px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `color(srgb 0.535686 0.761569 0.679216)` → `rgb(203, 211, 218)` - - **width**: `60.375px` → `38px` - - **height**: `21.7812px` → `12px` - - **rect**: `552,532 60x22` → `524,495 38x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > span:1` — "AUTO" - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **gap**: `4.8px` → `4px` - - **padding**: `2.4px 7.2px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `color(srgb 0.535686 0.761569 0.679216)` → `rgb(203, 211, 218)` - - **width**: `60.375px` → `38px` - - **height**: `21.7812px` → `12px` - - **rect**: `552,691 60x22` → `524,657 38x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > span:1` — "AUTO" - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **gap**: `4.8px` → `4px` - - **padding**: `2.4px 7.2px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `color(srgb 0.535686 0.761569 0.679216)` → `rgb(203, 211, 218)` - - **width**: `60.375px` → `38px` - - **height**: `21.7812px` → `12px` - - **rect**: `552,790 60x22` → `524,805 38x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > span:1` — "AUTO" - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **gap**: `4.8px` → `4px` - - **padding**: `2.4px 7.2px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `color(srgb 0.535686 0.761569 0.679216)` → `rgb(203, 211, 218)` - - **width**: `60.375px` → `38px` - - **height**: `21.7812px` → `12px` - - **rect**: `552,941 60x22` → `524,967 38x12` - -### `body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **alignItems**: `baseline` → `normal` - - **padding**: `0px` → `8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `13px` → `27px` - - **rect**: `769,648 467x13` → `716,637 239x27` - -### `body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **alignItems**: `baseline` → `normal` - - **padding**: `0px` → `8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.391px` - - **height**: `13px` → `27px` - - **rect**: `769,970 467x13` → `969,637 239x27` - -### `body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **alignItems**: `baseline` → `normal` - - **padding**: `0px` → `8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `13px` → `27px` - - **rect**: `769,1291 467x13` → `716,978 239x27` - -### `body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **alignItems**: `baseline` → `normal` - - **padding**: `0px` → `8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.391px` - - **height**: `13px` → `27px` - - **rect**: `769,1613 467x13` → `969,978 239x27` - -### `body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **alignItems**: `baseline` → `normal` - - **padding**: `0px` → `8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `13px` → `27px` - - **rect**: `769,1934 467x13` → `716,1319 239x27` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2` - - **fontSize**: `13.6px` → `16px` - - **lineHeight**: `20.4px` → `24px` - - **display**: `flex` → `block` - - **alignItems**: `center` → `normal` - - **justifyContent**: `space-between` → `normal` - - **gap**: `16px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `222.406px` → `234.422px` - - **height**: `53px` → `44px` - - **rect**: `463,1005 222x53` → `387,1006 234x44` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > button:2 > i:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `block` → `inline` - - **borderRadius**: `50%` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16.7969px` → `auto` - - **height**: `16.7969px` → `auto` - - **rect**: `667,1029 17x17` → `558,1015 0x0` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2.4px` → `8px` - - **gridTemplateColumns**: `none` → `78.625px 78.625px 78.625px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `164.812px` → `251.875px` - - **height**: `78.2812px` → `48px` - - **rect**: `1079,210 165x78` → `919,256 252x48` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1` - - **display**: `flex` → `grid` - - **alignItems**: `baseline` → `normal` - - **justifyContent**: `space-between` → `normal` - - **gap**: `16px` → `5px` - - **gridTemplateColumns**: `none` → `78.625px` - - **padding**: `4px 0px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `164.812px` → `78.625px` - - **height**: `24.5px` → `33px` - - **rect**: `1079,210 165x25` → `919,271 79x33` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2` - - **display**: `flex` → `grid` - - **alignItems**: `baseline` → `normal` - - **justifyContent**: `space-between` → `normal` - - **gap**: `16px` → `5px` - - **gridTemplateColumns**: `none` → `78.625px` - - **padding**: `4px 0px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `164.812px` → `78.625px` - - **height**: `24.5px` → `33px` - - **rect**: `1079,237 165x25` → `1006,271 79x33` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3` - - **display**: `flex` → `grid` - - **alignItems**: `baseline` → `normal` - - **justifyContent**: `space-between` → `normal` - - **gap**: `16px` → `5px` - - **gridTemplateColumns**: `none` → `78.625px` - - **padding**: `4px 0px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `164.812px` → `78.625px` - - **height**: `24.5px` → `33px` - - **rect**: `1079,264 165x25` → `1092,271 79x33` - -### `body > main:1 > div:2 > section:2 > div:2 > div:1 > div:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(228, 232, 235)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `207.375px` - - **padding**: `0px` → `16px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `276.859px` → `300px` - - **rect**: `769,367 467x277` → `716,337 239x300` - -### `body > main:1 > div:2 > section:2 > div:2 > div:2 > div:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(228, 232, 235)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `207.391px` - - **padding**: `0px` → `16px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.391px` - - **height**: `276.859px` → `300px` - - **rect**: `769,688 467x277` → `969,337 239x300` - -### `body > main:1 > div:2 > section:2 > div:2 > div:3 > div:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(228, 232, 235)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `207.375px` - - **padding**: `0px` → `16px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `276.859px` → `300px` - - **rect**: `769,1010 467x277` → `716,678 239x300` - -### `body > main:1 > div:2 > section:2 > div:2 > div:4 > div:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(228, 232, 235)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `207.391px` - - **padding**: `0px` → `16px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.391px` - - **height**: `276.859px` → `300px` - - **rect**: `769,1331 467x277` → `969,678 239x300` - -### `body > main:1 > div:2 > section:2 > div:2 > div:5 > div:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(228, 232, 235)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `207.375px` - - **padding**: `0px` → `16px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `467.219px` → `239.375px` - - **height**: `276.859px` → `300px` - - **rect**: `769,1652 467x277` → `716,1019 239x300` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2 > input:2` - - **textTransform**: `uppercase` → `none` - - **backgroundColor**: `rgb(238, 241, 244)` → `rgba(0, 0, 0, 0)` - - **padding**: `5.6px 8px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `solid` → `none` - - **width**: `85.2188px` → `127px` - - **height**: `27.1875px` → `13px` - - **rect**: `257,636 85x27` → `167,563 127x13` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `block` → `inline-block` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.609px` → `119.922px` - - **rect**: `388,631 138x16` → `341,555 120x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > label:1 > output:1` — "100%" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `0.8px` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `25.2031px` - - **height**: `auto` → `12px` - - **rect**: `617,609 44x20` → `596,534 25x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:1` — "100" - - **letterSpacing**: `0.6px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(109, 120, 131)` → `rgb(255, 255, 255)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(23, 105, 210)` - - **display**: `flex` → `block` - - **alignItems**: `center` → `normal` - - **padding**: `0px 11.2px` → `0px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(255, 255, 255)` - - **width**: `42.1875px` → `35.4688px` - - **rect**: `549,640 42x30` → `478,555 35x30` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `block` → `inline-block` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **rect**: `227,889 222x16` → `136,865 234x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > div:2 > input:2` - - **textTransform**: `uppercase` → `none` - - **backgroundColor**: `rgb(238, 241, 244)` → `rgba(0, 0, 0, 0)` - - **padding**: `5.6px 8px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `solid` → `none` - - **width**: `190.422px` → `194.422px` - - **height**: `27.1875px` → `13px` - - **rect**: `495,894 190x27` → `418,873 194x13` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `block` → `inline-block` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **rect**: `227,1040 222x16` → `136,1027 234x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(23, 105, 210)` → `rgba(0, 0, 0, 0)` - - **display**: `block` → `inline-block` - - **borderRadius**: `999px` → `0px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **width**: `38.3906px` → `32px` - - **height**: `20.7969px` → `18px` - - **rect**: `647,1027 38x21` → `542,1006 32x18` - -### `body > main:1 > div:2 > section:2 > div:2 > div:5` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgb(238, 241, 244)` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `4.8px` → `normal` - - **padding**: `6.4px` → `0px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgb(23, 105, 210)` - - **width**: `482px` → `241.375px` - - **height**: `309.438px` → `329px` - - **rect**: `761,1645 482x309` → `715,1018 241x329` - -### `body > main:1 > header:1 > div:3 > div:4 > span:2` — "/" - - **fontFamily**: `"IBM Plex Mono", monospace` → `"IBM Plex Sans", sans-serif` - - **fontSize**: `10px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 33, 43)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `6px` → `4.45312px` - - **height**: `13px` → `24px` - - **rect**: `1344,25 6x13` → `1194,20 4x24` - -### `body > main:1 > div:2 > section:1 > div:3 > div:1 > span:1` — "PROCESSING PIPELINE" - - **lineHeight**: `12px` → `normal` - - **letterSpacing**: `1px` → `1.2px` - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `153.609px` → `auto` - - **height**: `12px` → `auto` - - **rect**: `178,459 154x12` → `51,388 127x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > label:1` — "COLOR" - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **alignItems**: `baseline` → `normal` - - **gap**: `8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.594px` → `189px` - - **height**: `13px` → `12px` - - **rect**: `225,607 138x13` → `136,534 189x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > label:1` — "DIRECTION" - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **alignItems**: `center` → `normal` - - **gap**: `8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.609px` → `119.922px` - - **height**: `14px` → `12px` - - **rect**: `386,607 138x14` → `341,534 120x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > label:1` — "WIDTH" - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **alignItems**: `center` → `normal` - - **gap**: `8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **height**: `14px` → `12px` - - **rect**: `225,865 222x14` → `136,844 234x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > label:1` — "COLOR" - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **alignItems**: `baseline` → `normal` - - **gap**: `8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **height**: `13px` → `12px` - - **rect**: `463,865 222x13` → `387,844 234x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > label:1` — "RADIUS" - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **alignItems**: `center` → `normal` - - **gap**: `8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **height**: `14px` → `12px` - - **rect**: `225,1016 222x14` → `136,1006 234x12` - -### `body > main:1 > div:2 > section:2 > div:1 > div:1 > span:1` — "PIPELINE OUTPUTS" - - **lineHeight**: `12px` → `normal` - - **letterSpacing**: `1px` → `1.2px` - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `78.5781px` → `auto` - - **height**: `24px` → `auto` - - **rect**: `761,203 79x24` → `715,188 54x36` - -### `body > main:1 > div:2 > section:2 > div:2 > div:1` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgb(238, 241, 244)` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `4.8px` → `normal` - - **padding**: `6.4px` → `0px` - - **borderRadius**: `4px` → `0px` - - **width**: `482px` → `241.375px` - - **height**: `309.438px` → `329px` - - **rect**: `761,359 482x309` → `715,336 241x329` - -### `body > main:1 > div:2 > section:2 > div:2 > div:2` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgb(238, 241, 244)` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `4.8px` → `normal` - - **padding**: `6.4px` → `0px` - - **borderRadius**: `4px` → `0px` - - **width**: `482px` → `241.391px` - - **height**: `309.438px` → `329px` - - **rect**: `761,681 482x309` → `968,336 241x329` - -### `body > main:1 > div:2 > section:2 > div:2 > div:3` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgb(238, 241, 244)` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `4.8px` → `normal` - - **padding**: `6.4px` → `0px` - - **borderRadius**: `4px` → `0px` - - **width**: `482px` → `241.375px` - - **height**: `309.438px` → `329px` - - **rect**: `761,1002 482x309` → `715,677 241x329` - -### `body > main:1 > div:2 > section:2 > div:2 > div:4` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgb(238, 241, 244)` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `4.8px` → `normal` - - **padding**: `6.4px` → `0px` - - **borderRadius**: `4px` → `0px` - - **width**: `482px` → `241.391px` - - **height**: `309.438px` → `329px` - - **rect**: `761,1324 482x309` → `968,677 241x329` - -### `body > main:1 > footer:3 > span:1` — "easy-png-tools" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `142.812px` → `116.984px` - - **height**: `13px` → `12px` - - **rect**: `58,2108 143x13` → `51,1500 117x12` - -### `body > main:1 > footer:3 > span:1 > b:1` — "v2.4.0" - - **fontWeight**: `700` → `400` - - **letterSpacing**: `0.8px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `33px` - - **height**: `auto` → `12px` - - **rect**: `160,2108 41x13` → `135,1500 33x12` - -### `body > main:1 > footer:3 > span:2` — "pipeline is local-only" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `162.609px` → `140.969px` - - **height**: `16px` → `13px` - - **rect**: `690,2107 163x16` → `612,1500 141x13` - -### `body > main:1 > footer:3 > span:3` — "© 2024" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `40.8125px` → `33px` - - **height**: `13px` → `12px` - - **rect**: `1342,2108 41x13` → `1196,1500 33x12` - -### `body > main:1 > header:1 > div:3 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1224,18 28x28` → `1074,17 29x29` - -### `body > main:1 > header:1 > div:3 > button:3` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1268,18 28x28` → `1119,17 29x29` - -### `body > main:1 > div:2` - - **gridTemplateColumns**: `508.812px 520px` → `588.844px 532.766px` - - **padding**: `60px 57.6px 72px` → `60px 51.2px 72px` - - **margin**: `0px 120px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1200px` → `1280px` - - **height**: `2025.97px` → `1418.5px` - - **rect**: `120,64 1200x2026` → `0,64 1280x1419` - -### `body > main:1 > div:2 > section:1 > div:2 > div:1 > h1:1` — "Build your image pipeline." - - **fontSize**: `57.6px` → `51.2px` - - **lineHeight**: `51.84px` → `51.2px` - - **letterSpacing**: `-3.456px` → `-3.072px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `316.203px` → `405.062px` - - **height**: `155.484px` → `102.406px` - - **rect**: `178,155 316x155` → `51,154 405x102` - -### `body > main:1 > div:2 > section:1 > div:3 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `153.609px` → `148.484px` - - **height**: `37px` → `46px` - - **rect**: `178,459 154x37` → `51,380 148x46` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:1` — "01" - - **fontSize**: `22px` → `11px` - - **fontWeight**: `600` → `400` - - **lineHeight**: `22px` → `normal` - - **padding**: `17px 0px 6px 15px` → `17px 0px 0px 15px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **height**: `45px` → `150px` - - **rect**: `179,524 46x45` → `52,454 46x150` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **padding**: `0px` → `15px 18px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `520.844px` - - **height**: `147px` → `150px` - - **rect**: `225,524 461x147` → `118,454 521x150` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1` - - **alignItems**: `flex-start` → `center` - - **gap**: `8px` → `15px` - - **padding**: `8px 12px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `72px` → `65px` - - **rect**: `225,524 461x72` → `136,469 485x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `8px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `137.594px` → `189px` - - **height**: `75px` → `52px` - - **rect**: `225,596 138x75` → `136,534 189x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:1 > div:2` - - **gap**: `6.4px` → `8px` - - **padding**: `0px` → `0px 8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.594px` → `189px` - - **height**: `27.1875px` → `32px` - - **rect**: `225,636 138x27` → `136,554 189x32` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `0px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `137.609px` → `119.922px` - - **height**: `75px` → `52px` - - **rect**: `386,596 138x75` → `341,534 120x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:2 > label:1 > output:1` — "135 °" - - **fontSize**: `11px` → `10px` - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `35.5px` → `31.5156px` - - **height**: `14px` → `12px` - - **rect**: `488,607 36x14` → `430,534 32x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `8px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `137.609px` → `143.922px` - - **height**: `75px` → `52px` - - **rect**: `548,596 138x75` → `477,534 144x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:1` — "02" - - **fontSize**: `22px` → `11px` - - **fontWeight**: `600` → `400` - - **lineHeight**: `22px` → `normal` - - **padding**: `17px 0px 6px 15px` → `17px 0px 0px 15px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **height**: `45px` → `136px` - - **rect**: `179,683 46x45` → `52,616 46x136` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **padding**: `0px` → `15px 18px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `520.844px` - - **height**: `87px` → `136px` - - **rect**: `225,683 461x87` → `118,616 521x136` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1` - - **alignItems**: `flex-start` → `center` - - **gap**: `8px` → `15px` - - **padding**: `8px 12px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `72px` → `65px` - - **rect**: `225,683 461x72` → `136,631 485x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:1` — "03" - - **fontSize**: `22px` → `11px` - - **fontWeight**: `600` → `400` - - **lineHeight**: `22px` → `normal` - - **padding**: `17px 0px 6px 15px` → `17px 0px 0px 15px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **height**: `45px` → `150px` - - **rect**: `179,782 46x45` → `52,764 46x150` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **padding**: `0px` → `15px 18px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `520.844px` - - **height**: `139.188px` → `150px` - - **rect**: `225,782 461x139` → `118,764 521x150` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1` - - **alignItems**: `flex-start` → `center` - - **gap**: `8px` → `15px` - - **padding**: `8px 12px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `72px` → `65px` - - **rect**: `225,782 461x72` → `136,779 485x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `0px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `222.406px` → `234.422px` - - **height**: `67.1875px` → `52px` - - **rect**: `225,854 222x67` → `136,844 234x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:1 > label:1 > output:1` — "2 px" - - **fontSize**: `11px` → `10px` - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `28.4062px` → `25.2188px` - - **height**: `14px` → `12px` - - **rect**: `419,865 28x14` → `345,844 25x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `8px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `222.406px` → `234.422px` - - **height**: `67.1875px` → `52px` - - **rect**: `463,854 222x67` → `387,844 234x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2 > div:2 > div:2` - - **gap**: `6.4px` → `8px` - - **padding**: `0px` → `0px 8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `222.406px` → `234.422px` - - **height**: `27.1875px` → `32px` - - **rect**: `463,894 222x27` → `387,864 234x32` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:1` — "04" - - **fontSize**: `22px` → `11px` - - **fontWeight**: `600` → `400` - - **lineHeight**: `22px` → `normal` - - **padding**: `17px 0px 6px 15px` → `17px 0px 0px 15px` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **height**: `45px` → `142px` - - **rect**: `179,933 46x45` → `52,926 46x142` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **padding**: `0px` → `15px 18px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `520.844px` - - **height**: `125px` → `142px` - - **rect**: `225,933 461x125` → `118,926 521x142` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1` - - **alignItems**: `flex-start` → `center` - - **gap**: `8px` → `15px` - - **padding**: `8px 12px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `72px` → `65px` - - **rect**: `225,933 461x72` → `136,941 485x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `0px` → `normal` - - **padding**: `10px 0px 0px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **width**: `222.406px` → `234.422px` - - **height**: `53px` → `44px` - - **rect**: `225,1005 222x53` → `136,1006 234x44` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:1 > label:1 > output:1` — "18 px" - - **fontSize**: `11px` → `10px` - - **letterSpacing**: `0.5px` → `0.8px` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `35.5px` → `31.5156px` - - **height**: `14px` → `12px` - - **rect**: `412,1016 36x14` → `339,1006 32x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2 > div:2 > span:1` — "Preserve aspect ratio" - - **fontSize**: `13.6px` → `16px` - - **lineHeight**: `20.4px` → `24px` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `129.031px` → `auto` - - **height**: `20.3906px` → `auto` - - **rect**: `463,1027 129x20` → `387,1009 156x17` - -### `body > main:1 > div:2 > section:2 > div:1 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `78.5781px` → `75.8906px` - - **height**: `67px` → `87px` - - **rect**: `761,203 79x67` → `715,180 76x87` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1 > span:1` — "DIMENSIONS" - - **lineHeight**: `13.5px` → `normal` - - **letterSpacing**: `0.9px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `63px` → `78.625px` - - **height**: `13.5px` → `10px` - - **rect**: `1079,216 63x14` → `919,271 79x10` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:1 > b:2` — "1200 × 800 px" - - **fontWeight**: `700` → `400` - - **lineHeight**: `16.5px` → `normal` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `85.8125px` → `78.625px` - - **height**: `16.5px` → `13px` - - **rect**: `1158,214 86x17` → `919,291 79x13` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2 > span:1` — "FORMAT" - - **lineHeight**: `13.5px` → `normal` - - **letterSpacing**: `0.9px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `37.8125px` → `78.625px` - - **height**: `13.5px` → `10px` - - **rect**: `1079,243 38x14` → `1006,271 79x10` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:2 > b:2` — "PNG-24" - - **fontWeight**: `700` → `400` - - **lineHeight**: `16.5px` → `normal` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `39.6094px` → `78.625px` - - **height**: `16.5px` → `13px` - - **rect**: `1204,241 40x17` → `1006,291 79x13` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3 > span:1` — "SIZE" - - **lineHeight**: `13.5px` → `normal` - - **letterSpacing**: `0.9px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `25.2031px` → `78.625px` - - **height**: `13.5px` → `10px` - - **rect**: `1079,270 25x14` → `1092,271 79x10` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > div:3 > div:3 > b:2` — "1.2 MB" - - **fontWeight**: `700` → `400` - - **lineHeight**: `16.5px` → `normal` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `39.6094px` → `78.625px` - - **height**: `16.5px` → `13px` - - **rect**: `1204,268 40x17` → `1092,291 79x13` - -### `body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2 > span:1` — "SOURCE" - - **fontSize**: `10px` → `9px` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `40.8125px` → `29.7031px` - - **height**: `13px` → `10px` - - **rect**: `769,648 41x13` → `724,646 30x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2 > span:1` — "STEP 01" - - **fontSize**: `10px` → `9px` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `47.6094px` → `34.6406px` - - **height**: `13px` → `10px` - - **rect**: `769,970 48x13` → `977,646 35x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2 > span:1` — "STEP 02" - - **fontSize**: `10px` → `9px` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `47.6094px` → `34.6406px` - - **height**: `13px` → `10px` - - **rect**: `769,1291 48x13` → `724,987 35x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2 > span:1` — "STEP 03" - - **fontSize**: `10px` → `9px` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `47.6094px` → `34.6406px` - - **height**: `13px` → `10px` - - **rect**: `769,1613 48x13` → `977,987 35x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2 > span:1` — "FINAL OUTPUT" - - **fontSize**: `10px` → `9px` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `81.6094px` → `59.3906px` - - **height**: `13px` → `10px` - - **rect**: `769,1934 82x13` → `724,1328 59x10` - -### `body > main:1 > header:1 > nav:2` - - **gap**: `18px` → `22px` - - **margin**: `0px 0px 0px 24px` → `0px 28px 0px 355.891px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `376.594px` → `296.938px` - - **height**: `15px` → `12px` - - **rect**: `528,24 377x15` → `639,26 297x12` - -### `body > main:1 > header:1 > nav:2 > a:1` — "Workspace" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `69.125px` → `49.4844px` - - **height**: `15px` → `12px` - - **rect**: `528,24 69x15` → `639,26 49x12` - -### `body > main:1 > header:1 > nav:2 > a:2` — "Catalog" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `53.7656px` → `38.5px` - - **height**: `15px` → `12px` - - **rect**: `615,24 54x15` → `710,26 39x12` - -### `body > main:1 > header:1 > nav:2 > a:3` — "Gradient" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.4531px` → `43.9844px` - - **height**: `15px` → `12px` - - **rect**: `687,24 61x15` → `771,26 44x12` - -### `body > main:1 > header:1 > nav:2 > a:4` — "Background remover" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `138.25px` → `98.9688px` - - **height**: `15px` → `12px` - - **rect**: `767,24 138x15` → `837,26 99x12` - -### `body > main:1 > header:1 > div:3 > button:2 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1230,24 16x16` → `1080,23 17x17` - -### `body > main:1 > header:1 > div:3 > button:3 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1274,24 16x16` → `1125,23 17x17` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `171px` → `156.703px` - - **height**: `55px` → `65px` - - **rect**: `237,532 171x55` → `136,469 157x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:1 > span:1` — "BACKGROUND" - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `171px` → `auto` - - **height**: `13px` → `auto` - - **rect**: `237,532 171x13` → `136,477 67x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > span:1 > svg:1` - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **borderTopColor**: `rgb(37, 169, 106)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `560,537 12x12` → `524,495 12x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `block` - - **padding**: `1px 6px` → `0px` - - **width**: `28px` → `16px` - - **height**: `18px` → `16px` - - **rect**: `620,534 28x18` → `575,493 16x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2` - - **gap**: `0px 24px` → `16px` - - **gridTemplateColumns**: `137.594px 137.609px 137.609px` → `189px 119.922px 143.922px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `75px` → `52px` - - **rect**: `225,596 461x75` → `136,534 485x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:2` — "75" - - **letterSpacing**: `0.6px` → `normal` - - **textTransform**: `uppercase` → `none` - - **display**: `flex` → `block` - - **alignItems**: `center` → `normal` - - **padding**: `0px 11.2px` → `0px` - - **width**: `36.5781px` → `35.4844px` - - **rect**: `591,640 37x30` → `514,555 35x30` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:3` — "50" - - **letterSpacing**: `0.6px` → `normal` - - **textTransform**: `uppercase` → `none` - - **display**: `flex` → `block` - - **alignItems**: `center` → `normal` - - **padding**: `0px 11.2px` → `0px` - - **width**: `36.5781px` → `35.4844px` - - **rect**: `628,640 37x30` → `549,555 35x30` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:2 > div:3 > div:2 > button:4` — "25" - - **letterSpacing**: `0.6px` → `normal` - - **textTransform**: `uppercase` → `none` - - **display**: `flex` → `block` - - **alignItems**: `center` → `normal` - - **padding**: `0px 11.2px` → `0px` - - **width**: `36.5781px` → `35.4844px` - - **rect**: `664,640 37x30` → `585,555 35x30` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `153px` → `140.203px` - - **height**: `55px` → `65px` - - **rect**: `237,691 153x55` → `136,631 140x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:1 > span:1` — "TRANSFORM" - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `153px` → `auto` - - **height**: `13px` → `auto` - - **rect**: `237,691 153x13` → `136,639 60x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > span:1 > svg:1` - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **borderTopColor**: `rgb(37, 169, 106)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `560,696 12x12` → `524,657 12x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `block` - - **padding**: `1px 6px` → `0px` - - **width**: `28px` → `16px` - - **height**: `18px` → `16px` - - **rect**: `620,693 28x18` → `575,655 16x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `99px` → `90.7188px` - - **height**: `55px` → `65px` - - **rect**: `237,790 99x55` → `136,779 91x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:1 > span:1` — "STYLE" - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `99px` → `auto` - - **height**: `13px` → `auto` - - **rect**: `237,790 99x13` → `136,787 34x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > span:1 > svg:1` - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **borderTopColor**: `rgb(37, 169, 106)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `560,795 12x12` → `524,805 12x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `block` - - **padding**: `1px 6px` → `0px` - - **width**: `28px` → `16px` - - **height**: `18px` → `16px` - - **rect**: `620,792 28x18` → `575,803 16x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:2` - - **gap**: `0px 16px` → `16px` - - **gridTemplateColumns**: `222.406px 222.406px` → `234.422px 234.422px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `67.1875px` → `52px` - - **rect**: `225,854 461x67` → `136,844 485x52` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117px` → `107.219px` - - **height**: `55px` → `65px` - - **rect**: `237,941 117x55` → `136,941 107x65` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:1 > span:1` — "STYLE" - - **textTransform**: `uppercase` → `none` - - **display**: `block` → `inline` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117px` → `auto` - - **height**: `13px` → `auto` - - **rect**: `237,941 117x13` → `136,949 34x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > span:1 > svg:1` - - **lineHeight**: `15px` → `normal` - - **letterSpacing**: `0.8px` → `normal` - - **textTransform**: `uppercase` → `none` - - **color**: `rgb(37, 169, 106)` → `rgb(35, 131, 84)` - - **borderTopColor**: `rgb(37, 169, 106)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `560,946 12x12` → `524,967 12x12` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `block` - - **padding**: `1px 6px` → `0px` - - **width**: `28px` → `16px` - - **height**: `18px` → `16px` - - **rect**: `620,943 28x18` → `575,965 16x16` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:2` - - **gap**: `0px 16px` → `16px` - - **gridTemplateColumns**: `222.406px 222.406px` → `234.422px 234.422px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `460.812px` → `484.844px` - - **height**: `53px` → `44px` - - **rect**: `225,1005 461x53` → `136,1006 485x44` - -### `body > main:1 > div:2 > section:2 > div:1` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 12px` → `0px 0px 15px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `482px` → `494.766px` - - **height**: `200.281px` → `177px` - - **rect**: `761,143 482x200` → `715,143 495x177` - -### `body > main:1 > div:2 > section:2 > div:1 > div:2 > button:4 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1219,306 16x16` → `1187,272 17x17` - -### `body > main:1 > div:2 > section:2 > div:2 > div:1 > div:2 > b:2` — "original.png · 1200 × 800" - - **fontSize**: `10px` → `9px` - - **textAlign**: `start` → `right` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `150px` → `123.719px` - - **height**: `13px` → `10px` - - **rect**: `1086,648 150x13` → `824,646 124x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:2 > div:2 > b:2` — "gradient applied" - - **fontSize**: `10px` → `9px` - - **textAlign**: `start` → `right` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `96px` → `79.1719px` - - **height**: `13px` → `10px` - - **rect**: `1140,970 96x13` → `1122,646 79x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:3 > div:2 > b:2` — "background removed" - - **fontSize**: `10px` → `9px` - - **textAlign**: `start` → `right` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `108px` → `89.0781px` - - **height**: `13px` → `10px` - - **rect**: `1128,1291 108x13` → `858,987 89x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:4 > div:2 > b:2` — "outline added" - - **fontSize**: `10px` → `9px` - - **textAlign**: `start` → `right` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `78px` → `64.3281px` - - **height**: `13px` → `10px` - - **rect**: `1158,1613 78x13` → `1136,987 64x10` - -### `body > main:1 > div:2 > section:2 > div:2 > div:5 > div:2 > b:2` — "ready · PNG-24" - - **fontSize**: `10px` → `9px` - - **textAlign**: `start` → `right` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `84px` → `69.2812px` - - **height**: `13px` → `10px` - - **rect**: `1152,1934 84x13` → `878,1328 69x10` - -### `body > main:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(238, 241, 244)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `2138.97px` → `1528.5px` - - **rect**: `0,0 1440x2139` → `0,0 1280x1529` - -### `body > main:1 > header:1 > div:3 > span:1 > i:1` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `8px` → `6px` - - **height**: `8px` → `6px` - - **boxShadow**: `color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px` → `none` - - **rect**: `1105,28 8x8` → `963,29 6x6` - -### `body > main:1 > div:2 > section:1 > div:1` — "PNG PROCESSING WORKSPACE" - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `508.812px` → `588.844px` - - **height**: `13px` → `12px` - - **rect**: `178,124 509x13` → `51,124 589x12` - -### `body > main:1 > div:2 > section:1 > div:3` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `508.812px` → `588.844px` - - **height**: `50px` → `59px` - - **rect**: `178,459 509x50` → `51,380 589x59` - -### `body > main:1 > div:2 > section:1 > div:4` - - **gridTemplateColumns**: `508.812px` → `588.844px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `508.812px` → `588.844px` - - **height**: `550.188px` → `630px` - - **rect**: `178,509 509x550` → `51,439 589x630` - -### `body > main:1 > div:2 > section:1 > div:4 > article:1 > div:3 > div:1 > div:2` - - **gap**: `8px` → `13px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `121.375px` → `97px` - - **height**: `21.7812px` → `17px` - - **rect**: `552,532 121x22` → `524,493 97x17` - -### `body > main:1 > div:2 > section:1 > div:4 > article:2 > div:3 > div:1 > div:2` - - **gap**: `8px` → `13px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `121.375px` → `97px` - - **height**: `21.7812px` → `17px` - - **rect**: `552,691 121x22` → `524,655 97x17` - -### `body > main:1 > div:2 > section:1 > div:4 > article:3 > div:3 > div:1 > div:2` - - **gap**: `8px` → `13px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `121.375px` → `97px` - - **height**: `21.7812px` → `17px` - - **rect**: `552,790 121x22` → `524,803 97x17` - -### `body > main:1 > div:2 > section:1 > div:4 > article:4 > div:3 > div:1 > div:2` - - **gap**: `8px` → `13px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `121.375px` → `97px` - - **height**: `21.7812px` → `17px` - - **rect**: `552,941 121x22` → `524,965 97x17` - -### `body > main:1 > div:2 > section:1 > div:5 > span:2 > i:1` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `8px` → `6px` - - **height**: `8px` → `6px` - - **boxShadow**: `color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px` → `none` - - **rect**: `453,1082 8x8` → `426,1093 6x6` - -### `body > main:1 > div:2 > section:2 > div:2` - - **gridTemplateColumns**: `482px` → `241.375px 241.391px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `482px` → `494.766px` - - **height**: `1627.19px` → `1043px` - - **rect**: `761,343 482x1627` → `715,320 495x1043` - -### `body > main:1 > footer:3` - - **letterSpacing**: `0.8px` → `normal` - - **gap**: `16px` → `normal` - - **padding**: `16px 57.6px` → `16px 51.2px` - - **width**: `1440px` → `1280px` - - **height**: `49px` → `46px` - - **rect**: `0,2090 1440x49` → `0,1483 1280x46` - -### `body` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `2138.97px` → `1528.5px` - - **rect**: `0,0 1440x2139` → `0,0 1280x1529` - -### `body > main:1 > header:1` - - **padding**: `0px 57.6px` → `0px 51.2px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **rect**: `0,0 1440x64` → `0,0 1280x64` - -### `body > main:1 > header:1 > a:1 > span:2` — "easy-png-tools" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117.609px` → `107.766px` - - **height**: `18px` → `17px` - - **rect**: `98,23 118x18` → `91,23 108x17` - -### `body > main:1 > header:1 > a:1 > span:3` — "/ WORKSPACE" - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `79.2031px` → `73.7031px` - - **height**: `13px` → `12px` - - **rect**: `225,25 79x13` → `209,26 74x12` - -### `body > main:1 > header:1 > div:3` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `277.812px` → `265.328px` - - **height**: `28px` → `29px` - - **rect**: `1105,18 278x28` → `963,17 265x29` - -### `body > main:1 > header:1 > div:3 > span:1` — "AUTO PIPELINE" - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `103.406px` → `94.875px` - - **height**: `13px` → `12px` - - **rect**: `1105,25 103x13` → `963,26 95x12` - -### `body > main:1 > header:1 > div:3 > div:4` - - **alignItems**: `normal` → `center` - - **borderRadius**: `4px` → `0px` - - **width**: `70.4062px` → `64.4531px` - - **height**: `27px` → `26px` - - **rect**: `1312,18 70x27` → `1164,19 64x26` - -### `body > main:1 > div:2 > section:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `508.812px` → `588.844px` - - **height**: `970.453px` → `980.594px` - - **rect**: `178,124 509x970` → `51,124 589x981` - -### `body > main:1 > div:2 > section:1 > div:2` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `508.812px` → `588.844px` - - **height**: `248.266px` → `169.594px` - - **rect**: `178,155 509x248` → `51,154 589x170` - -### `body > main:1 > div:2 > section:1 > div:2 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `316.203px` → `405.062px` - - **height**: `248.266px` → `169.594px` - - **rect**: `178,155 316x248` → `51,154 405x170` - -### `body > main:1 > div:2 > section:1 > div:2 > div:1 > p:2` — "Chain simple tools together. Every change is processed automatically and previewed at each stage." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `316.203px` → `405.062px` - - **height**: `76.7812px` → `51.1875px` - - **rect**: `178,326 316x77` → `51,272 405x51` - -### `body > main:1 > div:2 > section:1 > div:2 > div:2 > span:2` — "source.png" - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `66px` → `60.4844px` - - **height**: `14px` → `13px` - - **rect**: `560,378 66x14` → `522,299 60x13` - -### `body > main:1 > div:2 > section:1 > div:2 > div:2 > b:3` — "1.8 MB" - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `39.6094px` → `36.2969px` - - **height**: `14px` → `13px` - - **rect**: `634,378 40x14` → `591,299 36x13` - -### Структурные расхождения - -_—_ - - -## /preview/list-tools (vs list-tools.html) - -- Токены light: **10**, dark: **16** -- Стиль-расхождений: **303** элементов / **1638** полей (из них геометрия: 303) -- Структурные: +0 / -0 / tag 0 / text 0 - -### Токены — Light - -| token | ours | ref | -|---|---|---| -| `--danger` | #e5484d | — | -| `--success` | #25a96a | — | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Токены — Dark - -| token | ours | ref | -|---|---|---| -| `--panel` | #182129 | #f8fafb | -| `--blue` | #54a2ff | #1769d2 | -| `--muted` | #91a0ac | #6d7883 | -| `--background` | #11171d | #eef1f4 | -| `--danger` | #ff7479 | — | -| `--foreground` | #e8eef2 | #17212b | -| `--success` | #25a96a | — | -| `--line` | #33414c | #cbd3da | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Расхождения стилей (топ 150) - -### `body > main:1 > div:2 > div:1 > div:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `16px` → `14px` - - **textAlign**: `start` → `right` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **flexDirection**: `column` → `row` - - **alignItems**: `flex-end` → `center` - - **gap**: `normal` → `14px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.2031px` → `123.625px` - - **height**: `73.5938px` → `57.5938px` - - **rect**: `1321,175 61x74` → `1105,206 124x58` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `58,324 648x24` → `51,415 575x26` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `734,324 648x24` → `654,415 575x26` - -### `body > main:1 > div:2 > div:3 > section:3 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `58,990 648x24` → `51,1081 575x26` - -### `body > main:1 > div:2 > div:3 > section:4 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `734,990 648x24` → `654,1081 575x26` - -### `body > main:1 > div:2 > div:3 > section:5 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `58,1656 648x24` → `51,1747 575x26` - -### `body > main:1 > div:2 > div:3 > section:6 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.32px` - - **alignItems**: `baseline` → `center` - - **gap**: `16px` → `normal` - - **padding**: `0px 0px 8px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `24px` → `26px` - - **rect**: `734,1656 648x24` → `654,1747 575x26` - -### `body > main:1 > div:2 > div:1 > div:2 > b:1` — "32" - - **fontSize**: `32px` → `64px` - - **fontWeight**: `700` → `400` - - **lineHeight**: `normal` → `57.6px` - - **letterSpacing**: `normal` → `-5.12px` - - **textAlign**: `start` → `right` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `38.4062px` → `60.1406px` - - **height**: `42px` → `57.5938px` - - **rect**: `1344,175 38x42` → `1105,206 60x58` - -### `body > main:1 > div:2 > div:1 > div:1 > h1:2` — "Tool catalog" - - **fontSize**: `32px` → `51.2px` - - **fontWeight**: `700` → `650` - - **lineHeight**: `48px` → `51.2px` - - **letterSpacing**: `normal` → `-3.072px` - - **margin**: `0px` → `12px 0px 14px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `510.719px` → `660px` - - **height**: `48px` → `51.2031px` - - **rect**: `58,147 511x48` → `51,154 660x51` - -### `body > main:1 > header:1 > div:3 > div:4 > span:2` — "/" - - **fontFamily**: `"IBM Plex Mono", monospace` → `"IBM Plex Sans", sans-serif` - - **fontSize**: `10px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 33, 43)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `6px` → `4.45312px` - - **height**: `13px` → `24px` - - **rect**: `1344,25 6x13` → `1194,20 4x24` - -### `body > main:1 > div:2 > div:1 > div:1 > div:1` — "EASY-PNG-TOOLS / CATALOG" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `2.16px` → `1.2px` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **margin**: `0px 0px 8px` → `0px 0px 18px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `510.719px` → `660px` - - **height**: `15px` → `12px` - - **rect**: `58,124 511x15` → `51,124 660x12` - -### `body > main:1 > div:2 > div:1 > div:1 > p:3` — "Focused utilities for working with PNG. Inspect, transform, and export — locally in your browser." - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `15.2px` → `14px` - - **lineHeight**: `22.8px` → `22.4px` - - **margin**: `8px 0px 0px` → `0px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `510.719px` → `660px` - - **height**: `45.5938px` → `44.7812px` - - **rect**: `58,203 511x46` → `51,219 660x45` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `59px` - - **rect**: `131,398 488x37` → `124,478 415x59` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,514 488x37` → `124,603 415x41` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `59px` - - **rect**: `131,630 488x37` → `124,710 415x59` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,746 488x37` → `124,835 415x41` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `59px` - - **rect**: `131,862 488x37` → `124,942 415x59` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `55px` → `59px` - - **rect**: `807,389 488x55` → `727,478 415x59` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,514 488x37` → `727,603 415x41` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,630 488x37` → `727,719 415x41` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `59px` - - **rect**: `807,746 488x37` → `727,826 415x59` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `55px` → `59px` - - **rect**: `807,853 488x55` → `727,942 415x59` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `55px` → `59px` - - **rect**: `131,1055 488x55` → `124,1144 415x59` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1180 488x37` → `124,1269 415x41` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1296 488x37` → `124,1385 415x41` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1412 488x37` → `124,1501 415x41` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1528 488x37` → `124,1617 415x41` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `55px` → `59px` - - **rect**: `807,1055 488x55` → `727,1144 415x59` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1180 488x37` → `727,1269 415x41` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1296 488x37` → `727,1385 415x41` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1412 488x37` → `727,1501 415x41` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1528 488x37` → `727,1617 415x41` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `59px` - - **rect**: `131,1730 488x37` → `124,1810 415x59` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1846 488x37` → `124,1935 415x41` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,1962 488x37` → `124,2051 415x41` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `131,2078 488x37` → `124,2167 415x41` - -### `body > main:1 > div:2 > div:3 > section:6 > div:2 > a:1 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1730 488x37` → `727,1819 415x41` - -### `body > main:1 > div:2 > div:3 > section:6 > div:2 > a:2 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1846 488x37` → `727,1935 415x41` - -### `body > main:1 > div:2 > div:3 > section:6 > div:2 > a:3 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,1962 488x37` → `727,2051 415x41` - -### `body > main:1 > div:2 > div:3 > section:6 > div:2 > a:4 > span:2` - - **display**: `flex` → `grid` - - **flexDirection**: `column` → `row` - - **gap**: `2px` → `8px` - - **gridTemplateColumns**: `none` → `414.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `37px` → `41px` - - **rect**: `807,2078 488x37` → `727,2167 415x41` - -### `body > main:1 > div:2 > footer:4 > span:1` — "•" - - **letterSpacing**: `0.8px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **display**: `block` → `inline` - - **margin**: `0px` → `0px 8px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `6.8125px` → `auto` - - **height**: `13px` → `auto` - - **rect**: `258,2231 7x13` → `208,2326 11x12` - -### `body > main:1 > header:1 > nav:2 > a:2` — "Catalog" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `53.7656px` → `38.5px` - - **height**: `15px` → `12px` - - **rect**: `591,24 54x15` → `679,26 39x12` - -### `body > main:1 > header:1 > div:3 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1224,18 28x28` → `1074,17 29x29` - -### `body > main:1 > header:1 > div:3 > button:3` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1268,18 28x28` → `1119,17 29x29` - -### `body > main:1 > div:2 > div:1 > div:2 > span:2` — "TOOLS AVAILABLE" - - **lineHeight**: `normal` → `14px` - - **letterSpacing**: `0.8px` → `normal` - - **margin**: `5.6px 0px 0px` → `0px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.2031px` → `49.4844px` - - **height**: `26px` → `28px` - - **rect**: `1321,223 61x26` → `1179,221 49x28` - -### `body > main:1 > div:2 > div:2 > div:2 > button:2` — "ALL" - - **letterSpacing**: `0.6px` → `normal` - - **color**: `rgb(255, 255, 255)` → `rgb(23, 105, 210)` - - **backgroundColor**: `rgb(23, 105, 210)` → `rgba(0, 0, 0, 0)` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **width**: `41px` → `38.5px` - - **height**: `27.7812px` → `30px` - - **rect**: `872,272 41x28` → `769,337 39x30` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > span:1` — "CONVERT" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `62.1719px` → `51.5781px` - - **height**: `15px` → `13px` - - **rect**: `58,324 62x15` → `51,415 52x13` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > span:1` — "TRANSPARENCY" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `106.562px` → `88.4219px` - - **height**: `15px` → `13px` - - **rect**: `734,324 107x15` → `654,415 88x13` - -### `body > main:1 > div:2 > div:3 > section:3 > div:1 > span:1` — "COLOR" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `44.4062px` → `36.8438px` - - **height**: `15px` → `13px` - - **rect**: `58,990 44x15` → `51,1081 37x13` - -### `body > main:1 > div:2 > div:3 > section:4 > div:1 > span:1` — "GEOMETRY" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `71.0469px` → `58.9531px` - - **height**: `15px` → `13px` - - **rect**: `734,990 71x15` → `654,1081 59x13` - -### `body > main:1 > div:2 > div:3 > section:5 > div:1 > span:1` — "FILTERS" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `62.1719px` → `51.5781px` - - **height**: `15px` → `13px` - - **rect**: `58,1656 62x15` → `51,1747 52x13` - -### `body > main:1 > div:2 > div:3 > section:6 > div:1 > span:1` — "ANALYZE" - - **fontSize**: `12px` → `11px` - - **fontWeight**: `400` → `600` - - **letterSpacing**: `1.68px` → `1.32px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `62.1719px` → `51.5781px` - - **height**: `15px` → `13px` - - **rect**: `734,1656 62x15` → `654,1747 52x13` - -### `body > main:1 > div:2 > footer:4` — "ALL OPERATIONS RUN LOCALLY YOUR FILES NEVER LEAVE THIS DEVICE" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `flex` → `block` - - **gap**: `24px` → `normal` - - **padding**: `24px 0px 0px` → `20px 0px 0px` - - **margin**: `56px 0px 0px` → `64px 0px 0px` - - **width**: `1324.81px` → `1177.62px` - - **height**: `38px` → `33px` - - **rect**: `58,2206 1325x38` → `51,2305 1178x33` - -### `body > main:1 > header:1 > nav:2` - - **gap**: `18px` → `22px` - - **margin**: `0px 0px 0px 24px` → `0px 28px 0px 337.797px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `376.594px` → `296.938px` - - **height**: `15px` → `12px` - - **rect**: `504,24 377x15` → `607,26 297x12` - -### `body > main:1 > header:1 > nav:2 > a:1` — "Workspace" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `69.125px` → `49.4844px` - - **height**: `15px` → `12px` - - **rect**: `504,24 69x15` → `607,26 49x12` - -### `body > main:1 > header:1 > nav:2 > a:3` — "Gradient" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.4531px` → `43.9844px` - - **height**: `15px` → `12px` - - **rect**: `663,24 61x15` → `739,26 44x12` - -### `body > main:1 > header:1 > nav:2 > a:4` — "Background remover" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `138.25px` → `98.9688px` - - **height**: `15px` → `12px` - - **rect**: `742,24 138x15` → `805,26 99x12` - -### `body > main:1 > header:1 > div:3 > button:2 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1230,24 16x16` → `1080,23 17x17` - -### `body > main:1 > header:1 > div:3 > button:3 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1274,24 16x16` → `1125,23 17x17` - -### `body > main:1 > div:2 > div:1` - - **gap**: `24px` → `40px` - - **padding**: `0px` → `0px 0px 42px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1324.81px` → `1177.62px` - - **height**: `124.594px` → `182.984px` - - **rect**: `58,124 1325x125` → `51,124 1178x183` - -### `body > main:1 > div:2 > div:2` - - **gap**: `16px` → `24px` - - **padding**: `20px 0px` → `24px 0px 42px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1324.81px` → `1177.62px` - - **height**: `75px` → `108px` - - **rect**: `58,249 1325x75` → `51,307 1178x108` - -### `body > main:1 > div:2 > div:2 > label:1` - - **backgroundColor**: `rgb(248, 250, 251)` → `rgba(0, 0, 0, 0)` - - **gap**: `8px` → `12px` - - **padding**: `8px 12px` → `12px 14px` - - **borderRadius**: `4px` → `0px` - - **width**: `202px` → `420px` - - **height**: `35px` → `42px` - - **rect**: `58,269 202x35` → `51,331 420x42` - -### `body > main:1 > div:2 > div:2 > div:2 > button:3` — "CONVERT" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `67.3906px` → `60.5px` - - **height**: `27.7812px` → `30px` - - **rect**: `920,272 67x28` → `814,337 61x30` - -### `body > main:1 > div:2 > div:2 > div:2 > button:4` — "TRANSPARENCY" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `100.391px` → `87.9844px` - - **height**: `27.7812px` → `30px` - - **rect**: `993,272 100x28` → `880,337 88x30` - -### `body > main:1 > div:2 > div:2 > div:2 > button:5` — "COLOR" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `54.1875px` → `49.5px` - - **height**: `27.7812px` → `30px` - - **rect**: `1100,272 54x28` → `974,337 50x30` - -### `body > main:1 > div:2 > div:2 > div:2 > button:6` — "GEOMETRY" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `74px` → `65.9844px` - - **height**: `27.7812px` → `30px` - - **rect**: `1161,272 74x28` → `1030,337 66x30` - -### `body > main:1 > div:2 > div:2 > div:2 > button:7` — "FILTERS" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `67.3906px` → `60.5px` - - **height**: `27.7812px` → `30px` - - **rect**: `1241,272 67x28` → `1102,337 61x30` - -### `body > main:1 > div:2 > div:2 > div:2 > button:8` — "ANALYZE" - - **letterSpacing**: `0.6px` → `normal` - - **padding**: `6.4px 9.6px` → `8px 10px` - - **borderRadius**: `4px` → `0px` - - **borderTopColor**: `rgb(203, 211, 218)` → `rgba(0, 0, 0, 0)` - - **width**: `67.3906px` → `60.5px` - - **height**: `27.7812px` → `30px` - - **rect**: `1315,272 67x28` → `1168,337 61x30` - -### `body > main:1 > div:2 > div:3 > section:1` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `58,324 648x610` → `51,415 575x610` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `570px` → `584px` - - **rect**: `58,364 648x570` → `51,441 575x584` - -### `body > main:1 > div:2 > div:3 > section:2` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `734,324 648x610` → `654,415 575x610` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `570px` → `584px` - - **rect**: `734,364 648x570` → `654,441 575x584` - -### `body > main:1 > div:2 > div:3 > section:3` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `58,990 648x610` → `51,1081 575x610` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `570px` → `584px` - - **rect**: `58,1030 648x570` → `51,1107 575x584` - -### `body > main:1 > div:2 > div:3 > section:4` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `734,990 648x610` → `654,1081 575x610` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `570px` → `584px` - - **rect**: `734,1030 648x570` → `654,1107 575x584` - -### `body > main:1 > div:2 > div:3 > section:5` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `58,1656 648x494` → `51,1747 575x494` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `454px` → `468px` - - **rect**: `58,1696 648x454` → `51,1773 575x468` - -### `body > main:1 > div:2 > div:3 > section:6` - - **display**: `flex` → `block` - - **flexDirection**: `column` → `row` - - **gap**: `16px` → `normal` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **rect**: `734,1656 648x494` → `654,1747 575x494` - -### `body > main:1 > div:2 > div:3 > section:6 > div:2` - - **gridTemplateColumns**: `648.406px` → `574.812px` - - **padding**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `648.406px` → `574.812px` - - **height**: `454px` → `468px` - - **rect**: `734,1696 648x454` → `654,1773 575x468` - -### `body > main:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(238, 241, 244)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `2315.59px` → `2409.98px` - - **rect**: `0,0 1440x2316` → `0,0 1280x2410` - -### `body > main:1 > header:1 > div:3 > span:1 > i:1` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `8px` → `6px` - - **height**: `8px` → `6px` - - **boxShadow**: `color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px` → `none` - - **rect**: `1071,28 8x8` → `932,29 6x6` - -### `body > main:1 > div:2` - - **padding**: `60px 57.6px 72px` → `60px 51.2px 72px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `2251.59px` → `2345.98px` - - **rect**: `0,64 1440x2252` → `0,64 1280x2346` - -### `body > main:1 > div:2 > div:2 > div:2` - - **gap**: `6.4px` → `6px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `531.484px` → `480.469px` - - **height**: `27.7812px` → `30px` - - **rect**: `851,272 531x28` → `748,337 480x30` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > i:2` — "05 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `652,326 54x13` → `571,415 55x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > i:2` — "05 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `1328,326 54x13` → `1174,415 55x12` - -### `body > main:1 > div:2 > div:3 > section:3 > div:1 > i:2` — "05 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `652,992 54x13` → `571,1081 55x12` - -### `body > main:1 > div:2 > div:3 > section:4 > div:1 > i:2` — "05 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `1328,992 54x13` → `1174,1081 55x12` - -### `body > main:1 > div:2 > div:3 > section:5 > div:1 > i:2` — "04 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `652,1658 54x13` → `571,1747 55x12` - -### `body > main:1 > div:2 > div:3 > section:6 > div:1 > i:2` — "04 TOOLS" - - **letterSpacing**: `0.8px` → `1.32px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `54.4062px` → `54.5625px` - - **height**: `13px` → `12px` - - **rect**: `1328,1658 54x13` → `1174,1747 55x12` - -### `body` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `2315.59px` → `2409.98px` - - **rect**: `0,0 1440x2316` → `0,0 1280x2410` - -### `body > main:1 > header:1` - - **padding**: `0px 57.6px` → `0px 51.2px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **rect**: `0,0 1440x64` → `0,0 1280x64` - -### `body > main:1 > header:1 > a:1 > span:2` — "easy-png-tools" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117.609px` → `107.766px` - - **height**: `18px` → `17px` - - **rect**: `98,23 118x18` → `91,23 108x17` - -### `body > main:1 > header:1 > a:1 > span:3` — "/ CATALOG" - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `64.8125px` → `60.2969px` - - **height**: `13px` → `12px` - - **rect**: `225,25 65x13` → `209,26 60x12` - -### `body > main:1 > header:1 > div:3` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `311.812px` → `296.828px` - - **height**: `28px` → `29px` - - **rect**: `1071,18 312x28` → `932,17 297x29` - -### `body > main:1 > header:1 > div:3 > span:1` — "LOCAL MODE / READY" - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `137.406px` → `126.375px` - - **height**: `13px` → `12px` - - **rect**: `1071,25 137x13` → `932,26 126x12` - -### `body > main:1 > header:1 > div:3 > div:4` - - **alignItems**: `normal` → `center` - - **borderRadius**: `4px` → `0px` - - **width**: `70.4062px` → `64.4531px` - - **height**: `27px` → `26px` - - **rect**: `1312,18 70x27` → `1164,19 64x26` - -### `body > main:1 > div:2 > div:1 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `510.719px` → `660px` - - **height**: `124.594px` → `139.984px` - - **rect**: `58,124 511x125` → `51,124 660x140` - -### `body > main:1 > div:2 > div:1 > div:2 > span:2 > br:1` - - **lineHeight**: `normal` → `14px` - - **letterSpacing**: `0.8px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `1382,223 0x13` → `1229,222 0x12` - -### `body > main:1 > div:2 > div:3` - - **gridTemplateColumns**: `648.406px 648.406px` → `574.812px 574.812px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1324.81px` → `1177.62px` - - **rect**: `58,324 1325x1826` → `51,415 1178x1826` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > strong:1` — "Convert JPG to PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,398 488x17` → `124,478 415x15` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > span:2 > span:2` — "Re-encode JPEG files as lossless PNG while preserving transparency." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `18px` → `36px` - - **rect**: `131,417 488x18` → `124,501 415x36` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:1 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,409 16x16` → `591,500 16x16` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > span:2 > strong:1` — "Convert WebP to PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,514 488x17` → `124,603 415x15` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:2 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,525 16x16` → `591,616 16x16` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > strong:1` — "PNG to Base64" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,630 488x17` → `124,710 415x15` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > span:2 > span:2` — "Encode an image as a base64 string for embedding in code or styles." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `18px` → `36px` - - **rect**: `131,649 488x18` → `124,733 415x36` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:3 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,641 16x16` → `591,732 16x16` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > span:2 > strong:1` — "PNG to Data URI" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,746 488x17` → `124,835 415x15` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:4 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,757 16x16` → `591,848 16x16` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > strong:1` — "Convert PNG to JPG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,862 488x17` → `124,942 415x15` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > span:2 > span:2` — "Composite transparency over a selected backdrop and export JPEG." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `18px` → `36px` - - **rect**: `131,881 488x18` → `124,965 415x36` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > a:5 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,873 16x16` → `591,964 16x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > span:2 > strong:1` — "Remove background PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,389 488x17` → `727,478 415x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:1 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,409 16x16` → `1194,500 16x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > span:2 > strong:1` — "Extract alpha mask" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,514 488x17` → `727,603 415x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:2 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,525 16x16` → `1194,616 16x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > span:2 > strong:1` — "Round corners PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,630 488x17` → `727,719 415x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:3 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,641 16x16` → `1194,732 16x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > strong:1` — "Outline PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,746 488x17` → `727,826 415x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > span:2 > span:2` — "Add a colored ring around opaque content with adjustable thickness." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `18px` → `36px` - - **rect**: `807,765 488x18` → `727,849 415x36` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:4 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,757 16x16` → `1194,848 16x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > span:2 > strong:1` — "Change PNG opacity" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,853 488x17` → `727,942 415x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > a:5 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,873 16x16` → `1194,964 16x16` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > span:2 > strong:1` — "Create gradient PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1055 488x17` → `124,1144 415x15` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:1 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1075 16x16` → `591,1166 16x16` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > span:2 > strong:1` — "Grayscale PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1180 488x17` → `124,1269 415x15` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:2 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1191 16x16` → `591,1282 16x16` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > span:2 > strong:1` — "Invert colors PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1296 488x17` → `124,1385 415x15` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:3 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1307 16x16` → `591,1398 16x16` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > span:2 > strong:1` — "Brightness & contrast" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1412 488x17` → `124,1501 415x15` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:4 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1423 16x16` → `591,1514 16x16` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > span:2 > strong:1` — "Temperature PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1528 488x17` → `124,1617 415x15` - -### `body > main:1 > div:2 > div:3 > section:3 > div:2 > a:5 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1539 16x16` → `591,1630 16x16` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > span:2 > strong:1` — "Resize PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,1055 488x17` → `727,1144 415x15` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:1 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,1075 16x16` → `1194,1166 16x16` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > span:2 > strong:1` — "Crop PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,1180 488x17` → `727,1269 415x15` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:2 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,1191 16x16` → `1194,1282 16x16` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > span:2 > strong:1` — "Rotate PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,1296 488x17` → `727,1385 415x15` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:3 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,1307 16x16` → `1194,1398 16x16` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > span:2 > strong:1` — "Flip PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,1412 488x17` → `727,1501 415x15` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:4 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,1423 16x16` → `1194,1514 16x16` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > span:2 > strong:1` — "Add padding to PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `807,1528 488x17` → `727,1617 415x15` - -### `body > main:1 > div:2 > div:3 > section:4 > div:2 > a:5 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `1347,1539 16x16` → `1194,1630 16x16` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > strong:1` — "Blur PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1730 488x17` → `124,1810 415x15` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > span:2 > span:2` — "Apply a fast Gaussian-style blur with transparent edge handling." - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `18px` → `36px` - - **rect**: `131,1749 488x18` → `124,1833 415x36` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:1 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1741 16x16` → `591,1832 16x16` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > span:2 > strong:1` — "Sharpen PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1846 488x17` → `124,1935 415x15` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:2 > svg:4` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **opacity**: `1` → `0` - - **rect**: `671,1857 16x16` → `591,1948 16x16` - -### `body > main:1 > div:2 > div:3 > section:5 > div:2 > a:3 > span:2 > strong:1` — "Vignette PNG" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `488.406px` → `414.812px` - - **height**: `17px` → `15px` - - **rect**: `131,1962 488x17` → `124,2051 415x15` - -### Структурные расхождения - -_—_ - - -## /preview/tools/linear-gradient-png (vs gradient.html) - -- Токены light: **10**, dark: **16** -- Стиль-расхождений: **103** элементов / **906** полей (из них геометрия: 103) -- Структурные: +0 / -0 / tag 0 / text 0 - -### Токены — Light - -| token | ours | ref | -|---|---|---| -| `--danger` | #e5484d | — | -| `--success` | #25a96a | — | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Токены — Dark - -| token | ours | ref | -|---|---|---| -| `--panel` | #182129 | #f8fafb | -| `--blue` | #54a2ff | #1769d2 | -| `--muted` | #91a0ac | #6d7883 | -| `--background` | #11171d | #eef1f4 | -| `--danger` | #ff7479 | — | -| `--foreground` | #e8eef2 | #17212b | -| `--success` | #25a96a | — | -| `--line` | #33414c | #cbd3da | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Расхождения стилей (топ 103) - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2` — "Download PNG" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgb(23, 105, 210)` - - **display**: `inline-block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `center` - - **gap**: `normal` → `9px` - - **padding**: `1px 6px` → `0px` - - **margin**: `0px` → `18px 0px 0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **borderTopStyle**: `outset` → `none` - - **width**: `141.297px` → `210.562px` - - **height**: `25px` → `42px` - - **rect**: `95,560 141x25` → `997,398 211x42` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1` — "Reset" - - **fontSize**: `13.3333px` → `12px` - - **lineHeight**: `normal` → `18px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **padding**: `1px 6px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **borderTopStyle**: `outset` → `none` - - **width**: `67.2969px` → `52.3594px` - - **height**: `24px` → `18px` - - **rect**: `0,512 67x24` → `72,918 52x18` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:1` — "Copy CSS" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `91px` → `80.9844px` - - **height**: `25px` → `33px` - - **rect**: `0,560 91x25` → `1127,337 81x33` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `14px` - - **padding**: `1px 6px` → `6px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **borderTopStyle**: `outset` → `none` - - **width**: `30px` → `26px` - - **height**: `24px` → `26px` - - **rect**: `126,634 30x24` → `1182,1061 26x26` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > label:1` — "GRADIENT TYPE" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `350.562px` - - **height**: `auto` → `12px` - - **rect**: `0,293 120x20` → `72,424 351x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1` — "COLOR STOPS" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `350.562px` - - **height**: `auto` → `12px` - - **rect**: `0,342 102x20` → `72,525 351x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1` — "DIRECTION" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `350.562px` - - **height**: `auto` → `12px` - - **rect**: `0,440 129x20` → `72,654 351x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1` — "OPACITY" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `350.562px` - - **height**: `auto` → `12px` - - **rect**: `0,489 116x20` → `72,831 351x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1` — "PNG" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(255, 255, 255)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `68px` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgba(255, 255, 255, 0.65)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `70px` - - **height**: `24px` → `70px` - - **rect**: `0,585 1440x24` → `829,704 70x70` - -### `body > main:1 > div:2 > div:2 > span:2` — "LIVE PREVIEW" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `79.9844px` - - **height**: `auto` → `12px` - - **rect**: `0,221 106x20` → `1149,258 80x12` - -### `body > main:1 > div:2 > div:2 > span:2 > i:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(37, 169, 106)` - - **display**: `inline` → `block` - - **borderRadius**: `0px` → `50%` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `6px` - - **height**: `auto` → `6px` - - **rect**: `0,221 0x20` → `1149,261 6x6` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > button:1` — "Linear" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgb(23, 105, 210)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **borderTopStyle**: `outset` → `none` - - **width**: `52.9219px` → `174.281px` - - **height**: `24px` → `30px` - - **rect**: `0,316 53x24` → `73,449 174x30` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > button:2` — "Radial" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **borderTopStyle**: `outset` → `none` - - **width**: `53.3281px` → `174.281px` - - **height**: `24px` → `30px` - - **rect**: `53,316 53x24` → `247,449 174x30` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1 > input:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 2px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(118, 118, 118)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `inset` → `none` - - **width**: `157px` → `127px` - - **height**: `24px` → `13px` - - **rect**: `0,365 157x24` → `103,559 127x13` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3 > input:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 2px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(118, 118, 118)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `inset` → `none` - - **width**: `157px` → `127px` - - **height**: `24px` → `13px` - - **rect**: `0,414 157x24` → `306,559 127x13` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:1` — "0° →" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `46.7188px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `0,463 47x24` → `72,716 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:2` — "45° ↗" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `51.1406px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `47,463 51x24` → `161,716 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:3` — "90° ↑" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `52.3125px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `98,463 52x24` → `250,716 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:4` — "135° ↖" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(238, 241, 244)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgb(23, 33, 43)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `59.1562px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `150,463 59x24` → `340,716 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:5` — "180° ←" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `62.7188px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `209,463 63x24` → `72,754 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:6` — "225° ↙" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `59.1562px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `272,463 59x24` → `161,754 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:7` — "270° ↓" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `60.3125px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `331,463 60x24` → `250,754 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3 > button:8` — "315° ↘" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 6px` → `8px 6px` - - **borderTopWidth**: `2px` → `1px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `outset` → `solid` - - **width**: `59.1562px` → `83.1406px` - - **height**: `24px` → `32px` - - **rect**: `392,463 59x24` → `340,754 83x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2` — "updates automatically" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `141.016px` - - **height**: `auto` → `13px` - - **rect**: `71,513 159x20` → `282,921 141x13` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2 > i:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(37, 169, 106)` - - **display**: `inline` → `block` - - **borderRadius**: `0px` → `50%` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `6px` - - **height**: `auto` → `6px` - - **rect**: `71,513 0x20` → `282,924 6x6` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `12px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(255, 255, 255)` - - **display**: `block` → `grid` - - **justifyContent**: `normal` → `center` - - **gridTemplateColumns**: `none` → `92.375px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `679.062px` - - **height**: `48px` → `537.594px` - - **rect**: `0,585 1440x48` → `525,483 679x538` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > pre:2` — "background: linear-gradient(135deg, #1769D2 0%, #00A8C7 100%); opacity: 1;" - - **fontFamily**: `monospace` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `12px` - - **lineHeight**: `24px` → `19.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(238, 241, 244)` - - **padding**: `0px` → `14px` - - **margin**: `16px 0px` → `12px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `687.062px` - - **height**: `48px` → `66.375px` - - **rect**: `0,674 1440x48` → `521,1099 687x66` - -### `body > main:1 > div:2 > div:1` — "PNG PROCESSING SINGLE TOOL" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **margin**: `0px` → `0px 0px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `24px` → `12px` - - **rect**: `0,64 1440x24` → `51,124 1178x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > strong:2` — "Configure output" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **display**: `inline` → `block` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `123.156px` - - **height**: `auto` → `17px` - - **rect**: `161,245 127x20` → `72,366 123x17` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > span:2` — "TOOL 01" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `46.8906px` - - **height**: `auto` → `12px` - - **rect**: `0,269 62x20` → `376,354 47x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > output:1` — "135 °" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `32.5px` - - **height**: `auto` → `12px` - - **rect**: `89,440 40x20` → `390,654 33x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > output:1` — "100 %" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `32.5px` - - **height**: `auto` → `12px` - - **rect**: `69,489 47x20` → `390,831 33x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > strong:2` — "gradient.png" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **display**: `inline` → `block` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `93.7812px` - - **height**: `auto` → `17px` - - **rect**: `137,538 96x20` → `521,395 94x17` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > span:1` — "GENERATED CSS" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `87.0781px` - - **height**: `auto` → `12px` - - **rect**: `0,635 122x20` → `521,1068 87x12` - -### `body > main:1 > div:2 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `end` - - **justifyContent**: `normal` → `space-between` - - **gap**: `normal` → `32px` - - **margin**: `0px` → `0px 0px 48px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `133.438px` → `116.391px` - - **rect**: `0,109 1440x133` → `51,154 1178x116` - -### `body > main:1 > div:2 > div:2 > div:1 > h1:1` — "Gradient background." - - **fontSize**: `32px` → `51.2px` - - **fontWeight**: `700` → `650` - - **lineHeight**: `48px` → `51.2px` - - **letterSpacing**: `normal` → `-3.072px` - - **margin**: `21.44px 0px` → `0px 0px 14px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `48px` → `51.2031px` - - **rect**: `0,109 1440x48` → `51,154 550x51` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **padding**: `0px` → `0px 8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `167px` - - **height**: `25px` → `32px` - - **rect**: `0,364 1440x25` → `72,549 167x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **padding**: `0px` → `0px 8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `167px` - - **height**: `25px` → `32px` - - **rect**: `0,413 1440x25` → `275,549 167x32` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > span:2` — "easy-png-tools" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `12px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(255, 255, 255)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `92.375px` - - **height**: `auto` → `14px` - - **rect**: `0,611 108x20` → `818,786 92x14` - -### `body > main:1 > header:1 > div:3 > div:4 > span:2` — "/" - - **fontFamily**: `"IBM Plex Mono", monospace` → `"IBM Plex Sans", sans-serif` - - **fontSize**: `10px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 33, 43)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `6px` → `4.45312px` - - **height**: `13px` → `24px` - - **rect**: `1344,25 6x13` → `1194,20 4x24` - -### `body > main:1 > div:2 > div:1 > span:1` — "/" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `0px` → `0px 7px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `137,66 6x20` → `159,124 13x12` - -### `body > main:1 > div:2 > div:3` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `start` - - **gap**: `normal` → `56px` - - **gridTemplateColumns**: `none` → `392.562px 729.062px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `479px` → `863.969px` - - **rect**: `0,243 1440x479` → `51,318 1178x864` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `18px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `48px` → `83px` - - **rect**: `0,243 1440x48` → `52,319 391x83` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > div:3` - - **display**: `block` → `grid` - - **gap**: `normal` → `6px` - - **gridTemplateColumns**: `none` → `83.1406px 83.1406px 83.1406px 83.1406px` - - **margin**: `0px` → `14px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.562px` - - **height**: `25px` → `70px` - - **rect**: `0,462 1440x25` → `72,716 351x70` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `16px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `25px` → `50px` - - **rect**: `0,511 1440x25` → `52,902 391x50` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `18px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `727.062px` - - **height**: `49px` → `140px` - - **rect**: `0,536 1440x49` → `501,319 727x140` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `flex-end` - - **gap**: `normal` → `10px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `210.562px` - - **height**: `25px` → `103px` - - **rect**: `0,560 1440x25` → `997,337 211x103` - -### `body > main:1 > footer:3 > span:1` — "easy-png-tools" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `142.812px` → `116.984px` - - **height**: `13px` → `12px` - - **rect**: `58,755 143x13` → `51,1271 117x12` - -### `body > main:1 > footer:3 > span:1 > b:1` — "v2.4.0" - - **fontWeight**: `700` → `400` - - **letterSpacing**: `0.8px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `33px` - - **height**: `auto` → `12px` - - **rect**: `160,755 41x13` → `135,1271 33x12` - -### `body > main:1 > footer:3 > span:2` — "gradient tool · local-only" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `176.812px` → `142.953px` - - **height**: `13px` → `12px` - - **rect**: `683,755 177x13` → `611,1271 143x12` - -### `body > main:1 > footer:3 > span:3` — "© 2024" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `40.8125px` → `33px` - - **height**: `13px` → `12px` - - **rect**: `1342,755 41x13` → `1196,1271 33x12` - -### `body > main:1 > header:1 > nav:2 > a:3` — "Gradient" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.4531px` → `43.9844px` - - **height**: `15px` → `12px` - - **rect**: `687,24 61x15` → `777,26 44x12` - -### `body > main:1 > header:1 > div:3 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1224,18 28x28` → `1074,17 29x29` - -### `body > main:1 > header:1 > div:3 > button:3` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1268,18 28x28` → `1119,17 29x29` - -### `body > main:1 > div:2 > div:2 > div:1 > p:2` — "Create a clean, export-ready gradient with precise control over color, direction and transparency." - - **lineHeight**: `24px` → `25.6px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `16px 0px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `24px` → `51.1875px` - - **rect**: `0,179 1440x24` → `51,219 550x51` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > span:1` — "GRADIENT SETTINGS" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `0,245 158x20` → `72,345 114x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `10px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.562px` - - **height**: `74px` → `32px` - - **rect**: `0,364 1440x74` → `72,549 351x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `134,440 129x16` → `72,679 129x16` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `122,489 129x16` → `72,856 129x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > span:1` — "OUTPUT PREVIEW" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `0,538 134x20` → `521,374 94x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `687.062px` - - **height**: `25px` → `26px` - - **rect**: `0,633 1440x25` → `521,1061 687x26` - -### `body > main:1 > header:1 > nav:2` - - **gap**: `18px` → `22px` - - **margin**: `0px 0px 0px 24px` → `0px 28px 0px 368.891px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `376.594px` → `296.938px` - - **height**: `15px` → `12px` - - **rect**: `528,24 377x15` → `645,26 297x12` - -### `body > main:1 > header:1 > nav:2 > a:1` — "Workspace" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `69.125px` → `49.4844px` - - **height**: `15px` → `12px` - - **rect**: `528,24 69x15` → `645,26 49x12` - -### `body > main:1 > header:1 > nav:2 > a:2` — "Catalog" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `53.7656px` → `38.5px` - - **height**: `15px` → `12px` - - **rect**: `615,24 54x15` → `716,26 39x12` - -### `body > main:1 > header:1 > nav:2 > a:4` — "Background remover" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `138.25px` → `98.9688px` - - **height**: `15px` → `12px` - - **rect**: `766,24 138x15` → `843,26 99x12` - -### `body > main:1 > header:1 > div:3 > button:2 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1230,24 16x16` → `1080,23 17x17` - -### `body > main:1 > header:1 > div:3 > button:3 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1274,24 16x16` → `1125,23 17x17` - -### `body > main:1 > div:2 > div:3 > section:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(248, 250, 251)` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `392.562px` - - **height**: `293px` → `635px` - - **rect**: `0,243 1440x293` → `51,318 393x635` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2` - - **display**: `block` → `flex` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.562px` - - **height**: `25px` → `32px` - - **rect**: `0,315 1440x25` → `72,448 351x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:1 > span:1` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `14px` - - **height**: `auto` → `14px` - - **rect**: `0,366 0x20` → `81,558 14x14` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > span:2` — "→" - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `16px` - - **height**: `auto` → `24px` - - **rect**: `0,391 16x20` → `249,553 16x24` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:2 > div:3 > span:1` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `14px` - - **height**: `auto` → `14px` - - **rect**: `0,415 0x20` → `284,558 14x14` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3` - - **margin**: `0px` → `14px 0px 0px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.562px` - - **height**: `0px` → `14px` - - **rect**: `0,438 1440x0` → `72,595 351x14` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1 > svg:1` - - **fontSize**: `13.3333px` → `12px` - - **lineHeight**: `normal` → `18px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `8,515 14x14` → `72,920 14x14` - -### `body > main:1 > div:2 > div:3 > section:2` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(248, 250, 251)` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `729.062px` - - **height**: `186px` → `863.969px` - - **rect**: `0,536 1440x186` → `500,318 729x864` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:1 > svg:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `10px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `8,563 15x15` → `1134,346 15x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `103,563 15x15` → `1043,412 15x15` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `214,564 14x14` → `1148,412 14x14` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(32, 42, 49)` - - **padding**: `0px` → `24px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `727.062px` - - **height**: `48px` → `585.594px` - - **rect**: `0,585 1440x48` → `501,459 727x586` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > div:1 > button:2 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(0, 0, 0)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `134,637 14x14` → `1188,1067 14x14` - -### `body > main:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(238, 241, 244)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `783.875px` → `1299.36px` - - **rect**: `0,0 1440x784` → `0,0 1280x1299` - -### `body > main:1 > header:1 > div:3 > span:1 > i:1` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `8px` → `6px` - - **height**: `8px` → `6px` - - **boxShadow**: `color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px` → `none` - - **rect**: `1111,28 8x8` → `970,29 6x6` - -### `body > main:1 > div:2` - - **padding**: `0px` → `60px 51.2px 72px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `657.875px` → `1190.36px` - - **rect**: `0,64 1440x658` → `0,64 1280x1190` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `49px` → `101px` - - **rect**: `0,291 1440x49` → `52,402 391x101` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `98px` → `129px` - - **rect**: `0,340 1440x98` → `52,503 391x129` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `49px` → `177px` - - **rect**: `0,438 1440x49` → `52,632 391x177` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `390.562px` - - **height**: `24px` → `93px` - - **rect**: `0,487 1440x24` → `52,809 391x93` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3` - - **padding**: `0px` → `16px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `727.062px` - - **height**: `89px` → `136.375px` - - **rect**: `0,633 1440x89` → `501,1045 727x136` - -### `body > main:1 > footer:3` - - **letterSpacing**: `0.8px` → `normal` - - **gap**: `16px` → `normal` - - **padding**: `16px 57.6px` → `16px 51.2px` - - **width**: `1440px` → `1280px` - - **height**: `46px` → `45px` - - **rect**: `0,738 1440x46` → `0,1254 1280x45` - -### `body` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `783.875px` → `1299.36px` - - **rect**: `0,0 1440x784` → `0,0 1280x1299` - -### `body > main:1 > header:1` - - **padding**: `0px 57.6px` → `0px 51.2px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **rect**: `0,0 1440x64` → `0,0 1280x64` - -### `body > main:1 > header:1 > a:1 > span:2` — "easy-png-tools" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117.609px` → `107.766px` - - **height**: `18px` → `17px` - - **rect**: `98,23 118x18` → `91,23 108x17` - -### `body > main:1 > header:1 > a:1 > span:3` — "/ GRADIENT" - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `72px` → `67px` - - **height**: `13px` → `12px` - - **rect**: `225,25 72x13` → `209,26 67x12` - -### `body > main:1 > header:1 > div:3` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `271.016px` → `259.031px` - - **height**: `28px` → `29px` - - **rect**: `1111,18 271x28` → `970,17 259x29` - -### `body > main:1 > header:1 > div:3 > span:1` — "LIVE PREVIEW" - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `96.6094px` → `88.5781px` - - **height**: `13px` → `12px` - - **rect**: `1111,25 97x13` → `970,26 89x12` - -### `body > main:1 > header:1 > div:3 > div:4` - - **alignItems**: `normal` → `center` - - **borderRadius**: `4px` → `0px` - - **width**: `70.4062px` → `64.4531px` - - **height**: `27px` → `26px` - - **rect**: `1312,18 70x27` → `1164,19 64x26` - -### `body > main:1 > div:2 > div:2 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `93.4375px` → `116.391px` - - **rect**: `0,109 1440x93` → `51,154 550x116` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `123.156px` - - **height**: `24px` → `46px` - - **rect**: `0,243 1440x24` → `72,337 123x46` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `93.7812px` - - **height**: `24px` → `46px` - - **rect**: `0,536 1440x24` → `521,366 94x46` - -### `body > main:1 > header:1 > a:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `239.609px` → `224.766px` - - **rect**: `58,17 240x30` → `51,17 225x30` - -### `body > main:1 > header:1 > div:3 > div:4 > button:1` — "RU" - - **letterSpacing**: `0.6px` → `normal` - - **width**: `31.2031px` → `29px` - - **height**: `25px` → `24px` - - **rect**: `1313,19 31x25` → `1165,20 29x24` - -### `body > main:1 > header:1 > div:3 > div:4 > button:3` — "EN" - - **letterSpacing**: `0.6px` → `normal` - - **width**: `31.2031px` → `29px` - - **height**: `25px` → `24px` - - **rect**: `1350,19 31x25` → `1199,20 29x24` - -### `body > main:1 > header:1 > a:1 > span:1` — "EP" - - **borderTopColor**: `rgb(255, 255, 255)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `58,17 30x30` → `51,17 30x30` - -### Структурные расхождения - -_—_ - - -## /preview/tools/remove-background-png (vs background-remover.html) - -- Токены light: **10**, dark: **16** -- Стиль-расхождений: **108** элементов / **965** полей (из них геометрия: 108) -- Структурные: +0 / -0 / tag 0 / text 0 - -### Токены — Light - -| token | ours | ref | -|---|---|---| -| `--danger` | #e5484d | — | -| `--success` | #25a96a | — | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Токены — Dark - -| token | ours | ref | -|---|---|---| -| `--panel` | #182129 | #f8fafb | -| `--blue` | #54a2ff | #1769d2 | -| `--muted` | #91a0ac | #6d7883 | -| `--background` | #11171d | #eef1f4 | -| `--danger` | #ff7479 | — | -| `--foreground` | #e8eef2 | #17212b | -| `--success` | #25a96a | — | -| `--line` | #33414c | #cbd3da | -| `--text-sm--line-height` | — | calc(1.25 / .875) | -| `--text-xs--line-height` | — | calc(1 / .75) | -| `--font-weight-medium` | — | 500 | -| `--spacing` | — | .25rem | -| `--text-xs` | — | .75rem | -| `--radius-md` | — | .375rem | -| `--radius-lg` | — | .5rem | -| `--text-sm` | — | .875rem | - -### Расхождения стилей (топ 108) - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2` — "Download result" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgb(23, 105, 210)` - - **display**: `inline-block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `center` - - **gap**: `normal` → `9px` - - **padding**: `1px 6px` → `0px` - - **margin**: `0px` → `18px 0px 0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **borderTopStyle**: `outset` → `none` - - **width**: `131.828px` → `193.203px` - - **height**: `25px` → `42px` - - **rect**: `96,624 132x25` → `1015,379 193x42` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `318px` - - **height**: `auto` → `18px` - - **rect**: `0,417 148x20` → `72,662 318x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `318px` - - **height**: `auto` → `18px` - - **rect**: `0,497 93x20` → `72,755 318x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1` — "Reset" - - **fontSize**: `13.3333px` → `12px` - - **lineHeight**: `normal` → `18px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **padding**: `1px 6px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **borderTopStyle**: `outset` → `none` - - **width**: `67.2969px` → `52.3594px` - - **height**: `24px` → `18px` - - **rect**: `0,576 67x24` → `72,842 52x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > label:1` — "BACKGROUND COLOR" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `318px` - - **height**: `auto` → `12px` - - **rect**: `0,293 159x20` → `72,424 318x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:3` — "sampled from image background" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **justifyContent**: `normal` → `flex-start` - - **gap**: `normal` → `8px` - - **margin**: `0px` → `10px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `318px` - - **height**: `24px` → `12px` - - **rect**: `0,343 1440x24` → `72,490 318x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1` — "COLOR SIMILARITY" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 12px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `318px` - - **height**: `auto` → `12px` - - **rect**: `0,369 184x20` → `72,547 318x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > b:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `32px` - - **height**: `auto` → `18px` - - **rect**: `148,417 0x20` → `358,662 32x18` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgba(255, 255, 255, 0.85)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `258.109px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `258.109px` - - **height**: `24px` → `259.75px` - - **rect**: `0,673 1440x24` → `528,538 271x273` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgba(255, 255, 255, 0.85)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `258.109px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `258.109px` - - **height**: `24px` → `259.75px` - - **rect**: `0,745 1440x24` → `903,545 258x260` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **gap**: `normal` → `24px` - - **padding**: `0px` → `16px 20px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `759.625px` - - **height**: `24px` → `45px` - - **rect**: `0,793 1440x24` → `468,886 760x45` - -### `body > main:1 > div:2 > div:2 > span:2` — "LIVE PREVIEW" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `79.9844px` - - **height**: `auto` → `12px` - - **rect**: `0,221 106x20` → `1149,258 80x12` - -### `body > main:1 > div:2 > div:2 > span:2 > i:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(37, 169, 106)` - - **display**: `inline` → `block` - - **borderRadius**: `0px` → `50%` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `6px` - - **height**: `auto` → `6px` - - **rect**: `0,221 0x20` → `1149,261 6x6` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > input:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 2px` → `0px` - - **borderTopWidth**: `2px` → `0px` - - **borderTopColor**: `rgb(118, 118, 118)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `inset` → `none` - - **width**: `157px` → `135px` - - **height**: `24px` → `13px` - - **rect**: `0,319 157x24` → `103,458 135x13` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `10px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `318px` - - **height**: `24px` → `12px` - - **rect**: `0,391 1440x24` → `72,605 318x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > b:2` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `32px` - - **height**: `auto` → `18px` - - **rect**: `93,497 0x20` → `358,755 32x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2` — "updates automatically" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `141.016px` - - **height**: `auto` → `13px` - - **rect**: `71,577 159x20` → `249,845 141x13` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > span:2 > i:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `11px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(37, 169, 106)` - - **display**: `inline` → `block` - - **borderRadius**: `0px` → `50%` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `6px` - - **height**: `auto` → `6px` - - **rect**: `71,577 0x20` → `249,848 6x6` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > span:1` — "processed" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **display**: `inline` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `5px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `68.4844px` - - **height**: `auto` → `14px` - - **rect**: `0,626 92x20` → `1139,337 68x14` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 10px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `24px` → `12px` - - **rect**: `0,649 1440x24` → `488,460 351x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `block` → `flex` - - **justifyContent**: `normal` → `space-between` - - **margin**: `0px` → `0px 0px 10px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `24px` → `12px` - - **rect**: `0,721 1440x24` → `857,460 351x12` - -### `body > main:1 > div:2 > div:1` — "PNG PROCESSING SINGLE TOOL" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **margin**: `0px` → `0px 0px 18px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `24px` → `12px` - - **rect**: `0,64 1440x24` → `51,124 1178x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > strong:2` — "Configure detection" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **display**: `inline` → `block` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `146.25px` - - **height**: `auto` → `17px` - - **rect**: `156,245 148x20` → `72,366 146x17` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > span:2` — "TOOL 02" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `46.8906px` - - **height**: `auto` → `12px` - - **rect**: `0,269 62x20` → `343,354 47x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > input:3` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(240, 240, 240)` → `rgba(0, 0, 0, 0)` - - **display**: `inline-block` → `block` - - **padding**: `1px 2px` → `0px` - - **borderTopWidth**: `1px` → `0px` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(23, 33, 43)` - - **borderTopStyle**: `solid` → `none` - - **width**: `50px` → `135px` - - **rect**: `161,315 50x27` → `246,451 135x27` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:3 > span:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `9px` - - **height**: `auto` → `9px` - - **rect**: `0,345 0x20` → `72,490 9x9` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > label:1 > output:1` — "72 %" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `26px` - - **height**: `auto` → `12px` - - **rect**: `147,369 38x20` → `364,547 26x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > label:1 > span:1` — "OUTER COLOR ONLY" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `103.969px` - - **height**: `auto` → `12px` - - **rect**: `0,417 148x20` → `72,665 104x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > label:1 > span:1` — "SHOW MASK" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `58.4844px` - - **height**: `auto` → `12px` - - **rect**: `0,497 93x20` → `72,758 58x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > strong:2` — "comparison.png" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **display**: `inline` → `block` - - **margin**: `0px` → `5px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `107.766px` - - **height**: `auto` → `17px` - - **rect**: `134,602 121x20` → `488,385 108x17` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1 > b:2` — "original.png" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **fontWeight**: `700` → `400` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `65.9844px` - - **height**: `auto` → `12px` - - **rect**: `61,651 90x20` → `773,460 66x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > div:1 > span:1` — "OBJECT" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgba(255, 255, 255, 0.85)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `46.1875px` - - **height**: `auto` → `17px` - - **rect**: `0,675 58x20` → `640,665 47x19` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1 > b:2` — "removed-bg.png" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **fontWeight**: `700` → `400` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `76.9844px` - - **height**: `auto` → `12px` - - **rect**: `56,723 124x20` → `1131,460 77x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > div:1 > span:1` — "PNG" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `14px` - - **fontWeight**: `400` → `600` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgba(255, 255, 255, 0.85)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `23.0938px` - - **height**: `auto` → `17px` - - **rect**: `0,747 32x20` → `1021,666 23x17` - -### `body > main:1 > div:2 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `end` - - **justifyContent**: `normal` → `space-between` - - **gap**: `normal` → `32px` - - **margin**: `0px` → `0px 0px 48px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `133.438px` → `116.391px` - - **rect**: `0,109 1440x133` → `51,154 1178x116` - -### `body > main:1 > div:2 > div:2 > div:1 > h1:1` — "Remove background." - - **fontSize**: `32px` → `51.2px` - - **fontWeight**: `700` → `650` - - **lineHeight**: `48px` → `51.2px` - - **letterSpacing**: `normal` → `-3.072px` - - **margin**: `21.44px 0px` → `0px 0px 14px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `48px` → `51.2031px` - - **rect**: `0,109 1440x48` → `51,154 550x51` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `8px` - - **padding**: `0px` → `0px 8px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `318px` - - **height**: `28px` → `32px` - - **rect**: `0,315 1440x28` → `72,448 318x32` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3 > span:1` — "strict edges" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `65.9844px` - - **height**: `auto` → `12px` - - **rect**: `0,393 84x20` → `72,605 66x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > div:3 > span:2` — "more removal" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `65.9844px` - - **height**: `auto` → `12px` - - **rect**: `87,393 99x20` → `324,605 66x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:1 > span:1` — "SOURCE" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `33px` - - **height**: `auto` → `12px` - - **rect**: `0,651 61x20` → `488,460 33x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(232, 238, 242)` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `348.812px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `48px` → `384px` - - **rect**: `0,673 1440x48` → `488,482 351x384` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1 > div:2 > span:2` — "1200 × 800" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `49.4844px` - - **height**: `auto` → `10px` - - **rect**: `0,699 84x20` → `779,846 49x10` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:1 > span:1` — "RESULT" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `33px` - - **height**: `auto` → `12px` - - **rect**: `0,723 56x20` → `857,460 33x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2 > span:2` — "1200 × 800" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `9px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `49.4844px` - - **height**: `auto` → `10px` - - **rect**: `0,771 84x20` → `1147,846 49x10` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:1` — "FORMAT" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `77.5px` - - **height**: `auto` → `12px` - - **rect**: `0,795 125x20` → `488,903 78x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:2` — "ALPHA" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `77.5px` - - **height**: `auto` → `12px` - - **rect**: `129,795 126x20` → `590,903 78x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:3` — "SIMILARITY" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `88.4844px` - - **height**: `auto` → `12px` - - **rect**: `258,795 131x20` → `691,903 88x12` - -### `body > main:1 > header:1 > div:3 > div:4 > span:2` — "/" - - **fontFamily**: `"IBM Plex Mono", monospace` → `"IBM Plex Sans", sans-serif` - - **fontSize**: `10px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 33, 43)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `6px` → `4.45312px` - - **height**: `13px` → `24px` - - **rect**: `1344,25 6x13` → `1194,20 4x24` - -### `body > main:1 > div:2 > div:1 > span:1` — "/" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `0px` → `0px 7px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `137,66 6x20` → `159,124 13x12` - -### `body > main:1 > div:2 > div:3` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `start` - - **gap**: `normal` → `56px` - - **gridTemplateColumns**: `none` → `360px 761.625px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1177.62px` - - **height**: `574px` → `614px` - - **rect**: `0,243 1440x574` → `51,318 1178x614` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `18px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `48px` → `83px` - - **rect**: `0,243 1440x48` → `52,319 358x83` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4 > p:2` — "Only remove connected background pixels from the edges." - - **fontSize**: `16px` → `12px` - - **lineHeight**: `24px` → `18px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `16px 0px` → `8px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `318px` - - **height**: `24px` → `18px` - - **rect**: `0,455 1440x24` → `72,692 318x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5 > p:2` — "Preview the detected transparency mask." - - **fontSize**: `16px` → `12px` - - **lineHeight**: `24px` → `18px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `16px 0px` → `8px 0px 0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `318px` - - **height**: `24px` → `18px` - - **rect**: `0,535 1440x24` → `72,785 318x18` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `16px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `25px` → `50px` - - **rect**: `0,575 1440x25` → `52,826 358x50` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `space-between` - - **padding**: `0px` → `18px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `759.625px` - - **height**: `49px` → `121px` - - **rect**: `0,600 1440x49` → `468,319 760x121` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **justifyContent**: `normal` → `flex-end` - - **gap**: `normal` → `10px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `193.203px` - - **height**: `25px` → `84px` - - **rect**: `0,624 1440x25` → `1015,337 193x84` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2` - - **display**: `block` → `grid` - - **gap**: `normal` → `18px` - - **gridTemplateColumns**: `none` → `350.812px 350.812px` - - **padding**: `0px` → `20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `759.625px` - - **height**: `144px` → `446px` - - **rect**: `0,649 1440x144` → `468,440 760x446` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2 > div:2` - - **display**: `block` → `grid` - - **alignItems**: `normal` → `center` - - **gridTemplateColumns**: `none` → `348.812px` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `48px` → `384px` - - **rect**: `0,745 1440x48` → `857,482 351x384` - -### `body > main:1 > footer:3 > span:1` — "easy-png-tools" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `142.812px` → `116.984px` - - **height**: `13px` → `12px` - - **rect**: `58,834 143x13` → `51,1021 117x12` - -### `body > main:1 > footer:3 > span:1 > b:1` — "v2.4.0" - - **fontWeight**: `700` → `400` - - **letterSpacing**: `0.8px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `33px` - - **height**: `auto` → `12px` - - **rect**: `160,834 41x13` → `135,1021 33x12` - -### `body > main:1 > footer:3 > span:2` — "background remover · local-only" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `210.812px` → `170.453px` - - **height**: `13px` → `12px` - - **rect**: `666,834 211x13` → `597,1021 170x12` - -### `body > main:1 > footer:3 > span:3` — "© 2024" - - **letterSpacing**: `0.8px` → `normal` - - **display**: `block` → `flex` - - **alignItems**: `normal` → `center` - - **gap**: `normal` → `7px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `40.8125px` → `33px` - - **height**: `13px` → `12px` - - **rect**: `1342,834 41x13` → `1196,1021 33x12` - -### `body > main:1 > header:1 > nav:2 > a:4` — "Background remover" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **color**: `rgb(109, 120, 131)` → `rgb(23, 105, 210)` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `138.25px` → `98.9688px` - - **height**: `15px` → `12px` - - **rect**: `792,24 138x15` → `824,26 99x12` - -### `body > main:1 > header:1 > div:3 > button:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1224,18 28x28` → `1074,17 29x29` - -### `body > main:1 > header:1 > div:3 > button:3` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **display**: `flex` → `grid` - - **justifyContent**: `center` → `normal` - - **gridTemplateColumns**: `none` → `17px` - - **width**: `28px` → `29px` - - **height**: `28px` → `29px` - - **rect**: `1268,18 28x28` → `1119,17 29x29` - -### `body > main:1 > div:2 > div:2 > div:1 > p:2` — "Select a background color and tune the edge detection. Changes are processed automatically in your browser." - - **lineHeight**: `24px` → `25.6px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **margin**: `16px 0px` → `0px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `24px` → `51.1875px` - - **rect**: `0,179 1440x24` → `51,219 550x51` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1 > span:1` — "REMOVER SETTINGS" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `0,245 152x20` → `72,345 107x12` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3 > input:2` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **color**: `rgb(16, 16, 16)` → `rgb(23, 33, 43)` - - **backgroundColor**: `rgb(255, 255, 255)` → `rgba(0, 0, 0, 0)` - - **margin**: `2px` → `0px` - - **borderTopColor**: `rgb(16, 16, 16)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `190,369 129x16` → `72,572 129x16` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1 > span:1` — "SOURCE / RESULT" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **letterSpacing**: `normal` → `1.2px` - - **color**: `rgb(23, 33, 43)` → `rgb(109, 120, 131)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `0,602 130x20` → `488,364 100x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > span:1 > svg:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **lineHeight**: `24px` → `normal` - - **color**: `rgb(23, 33, 43)` → `rgb(37, 169, 106)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `0,628 14x14` → `1139,337 14x14` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:1 > b:1` — "PNG-24" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **margin**: `0px` → `0px 0px 0px 6px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `65,795 59x20` → `533,903 33x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:2 > b:1` — "ENABLED" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **margin**: `0px` → `0px 0px 0px 6px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `182,795 72x20` → `629,903 39x12` - -### `body > main:1 > div:2 > div:3 > section:2 > div:3 > span:3 > b:1` — "72 %" - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `16px` → `10px` - - **fontWeight**: `700` → `600` - - **lineHeight**: `24px` → `normal` - - **margin**: `0px` → `0px 0px 0px 6px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `351,795 39x20` → `758,903 22x12` - -### `body > main:1 > header:1 > nav:2` - - **gap**: `18px` → `22px` - - **margin**: `0px 0px 0px 24px` → `0px 28px 0px 283px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `376.594px` → `296.938px` - - **height**: `15px` → `12px` - - **rect**: `554,24 377x15` → `626,26 297x12` - -### `body > main:1 > header:1 > nav:2 > a:1` — "Workspace" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `69.125px` → `49.4844px` - - **height**: `15px` → `12px` - - **rect**: `554,24 69x15` → `626,26 49x12` - -### `body > main:1 > header:1 > nav:2 > a:2` — "Catalog" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `53.7656px` → `38.5px` - - **height**: `15px` → `12px` - - **rect**: `641,24 54x15` → `697,26 39x12` - -### `body > main:1 > header:1 > nav:2 > a:3` — "Gradient" - - **fontSize**: `12px` → `10px` - - **letterSpacing**: `0.48px` → `normal` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `61.4531px` → `43.9844px` - - **height**: `15px` → `12px` - - **rect**: `713,24 61x15` → `758,26 44x12` - -### `body > main:1 > header:1 > div:3 > button:2 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1230,24 16x16` → `1080,23 17x17` - -### `body > main:1 > header:1 > div:3 > button:3 > svg:1` - - **fontSize**: `13.3333px` → `16px` - - **lineHeight**: `normal` → `24px` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `16px` → `17px` - - **height**: `16px` → `17px` - - **rect**: `1274,24 16x16` → `1125,23 17x17` - -### `body > main:1 > div:2 > div:3 > section:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(248, 250, 251)` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `360px` - - **height**: `357px` → `559px` - - **rect**: `0,243 1440x357` → `51,318 360x559` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2 > div:2 > span:1` - - **display**: `inline` → `block` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `auto` → `14px` - - **height**: `auto` → `14px` - - **rect**: `0,320 0x20` → `81,457 14x14` - -### `body > main:1 > div:2 > div:3 > section:1 > div:6 > button:1 > svg:1` - - **fontSize**: `13.3333px` → `12px` - - **lineHeight**: `normal` → `18px` - - **color**: `rgb(0, 0, 0)` → `rgb(23, 105, 210)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `8,579 14x14` → `72,844 14x14` - -### `body > main:1 > div:2 > div:3 > section:2` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(248, 250, 251)` - - **borderTopWidth**: `0px` → `1px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `761.625px` - - **height**: `217px` → `614px` - - **rect**: `0,600 1440x217` → `467,318 762x614` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:2 > button:2 > svg:1` - - **fontFamily**: `"IBM Plex Sans", sans-serif` → `"IBM Plex Mono", monospace` - - **fontSize**: `13.3333px` → `11px` - - **color**: `rgb(0, 0, 0)` → `rgb(255, 255, 255)` - - **display**: `inline` → `block` - - **borderTopColor**: `rgb(0, 0, 0)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `104,627 15x15` → `1054,393 15x15` - -### `body > main:1` - - **backgroundColor**: `rgba(0, 0, 0, 0)` → `rgb(238, 241, 244)` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `862.875px` → `1049.39px` - - **rect**: `0,0 1440x863` → `0,0 1280x1049` - -### `body > main:1 > header:1 > div:3 > span:1 > i:1` - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `8px` → `6px` - - **height**: `8px` → `6px` - - **boxShadow**: `color(srgb 0.145098 0.662745 0.415686 / 0.25) 0px 0px 0px 2px` → `none` - - **rect**: `1091,28 8x8` → `951,29 6x6` - -### `body > main:1 > div:2` - - **padding**: `0px` → `60px 51.2px 72px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `752.875px` → `940.391px` - - **rect**: `0,64 1440x753` → `0,64 1280x940` - -### `body > main:1 > div:2 > div:3 > section:1 > div:2` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `76px` → `123px` - - **rect**: `0,291 1440x76` → `52,402 358x123` - -### `body > main:1 > div:2 > div:3 > section:1 > div:3` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `48px` → `115px` - - **rect**: `0,367 1440x48` → `52,525 358x115` - -### `body > main:1 > div:2 > div:3 > section:1 > div:4` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `64px` → `93px` - - **rect**: `0,415 1440x64` → `52,640 358x93` - -### `body > main:1 > div:2 > div:3 > section:1 > div:5` - - **padding**: `0px` → `22px 20px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `358px` - - **height**: `64px` → `93px` - - **rect**: `0,495 1440x64` → `52,733 358x93` - -### `body > main:1 > footer:3` - - **letterSpacing**: `0.8px` → `normal` - - **gap**: `16px` → `normal` - - **padding**: `16px 57.6px` → `16px 51.2px` - - **width**: `1440px` → `1280px` - - **height**: `46px` → `45px` - - **rect**: `0,817 1440x46` → `0,1004 1280x45` - -### `body` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **height**: `862.875px` → `1049.39px` - - **rect**: `0,0 1440x863` → `0,0 1280x1049` - -### `body > main:1 > header:1` - - **padding**: `0px 57.6px` → `0px 51.2px` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `1280px` - - **rect**: `0,0 1440x64` → `0,0 1280x64` - -### `body > main:1 > header:1 > a:1 > span:2` — "easy-png-tools" - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117.609px` → `107.766px` - - **height**: `18px` → `17px` - - **rect**: `98,23 118x18` → `91,23 108x17` - -### `body > main:1 > header:1 > a:1 > span:3` — "/ BACKGROUND REMOVER" - - **borderTopColor**: `rgb(23, 105, 210)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `144px` → `133.984px` - - **height**: `13px` → `12px` - - **rect**: `225,25 144x13` → `209,26 134x12` - -### `body > main:1 > header:1 > div:3` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `291.406px` → `277.938px` - - **height**: `28px` → `29px` - - **rect**: `1091,18 291x28` → `951,17 278x29` - -### `body > main:1 > header:1 > div:3 > span:1` — "AUTO PROCESSING" - - **borderTopColor**: `rgb(109, 120, 131)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `117px` → `107.484px` - - **height**: `13px` → `12px` - - **rect**: `1091,25 117x13` → `951,26 107x12` - -### `body > main:1 > header:1 > div:3 > div:4` - - **alignItems**: `normal` → `center` - - **borderRadius**: `4px` → `0px` - - **width**: `70.4062px` → `64.4531px` - - **height**: `27px` → `26px` - - **rect**: `1312,18 70x27` → `1164,19 64x26` - -### `body > main:1 > div:2 > div:2 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `550px` - - **height**: `93.4375px` → `116.391px` - - **rect**: `0,109 1440x93` → `51,154 550x116` - -### `body > main:1 > div:2 > div:3 > section:1 > div:1 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `146.25px` - - **height**: `24px` → `46px` - - **rect**: `0,243 1440x24` → `72,337 146x46` - -### `body > main:1 > div:2 > div:3 > section:2 > div:1 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `107.766px` - - **height**: `24px` → `46px` - - **rect**: `0,600 1440x24` → `488,356 108x46` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `72px` → `406px` - - **rect**: `0,649 1440x72` → `488,460 351x406` - -### `body > main:1 > div:2 > div:3 > section:2 > div:2 > div:2` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `1440px` → `350.812px` - - **height**: `72px` → `406px` - - **rect**: `0,721 1440x72` → `857,460 351x406` - -### `body > main:1 > header:1 > a:1` - - **borderTopColor**: `rgb(23, 33, 43)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **width**: `311.609px` → `291.75px` - - **rect**: `58,17 312x30` → `51,17 292x30` - -### `body > main:1 > header:1 > div:3 > div:4 > button:1` — "RU" - - **letterSpacing**: `0.6px` → `normal` - - **width**: `31.2031px` → `29px` - - **height**: `25px` → `24px` - - **rect**: `1313,19 31x25` → `1165,20 29x24` - -### `body > main:1 > header:1 > div:3 > div:4 > button:3` — "EN" - - **letterSpacing**: `0.6px` → `normal` - - **width**: `31.2031px` → `29px` - - **height**: `25px` → `24px` - - **rect**: `1350,19 31x25` → `1199,20 29x24` - -### `body > main:1 > header:1 > a:1 > span:1` — "EP" - - **borderTopColor**: `rgb(255, 255, 255)` → `rgb(203, 211, 218)` - - **borderTopStyle**: `none` → `solid` - - **rect**: `58,17 30x30` → `51,17 30x30` - -### Структурные расхождения - -_—_ diff --git a/web/audit/dom-report.json b/web/audit/dom-report.json deleted file mode 100644 index 98def96..0000000 --- a/web/audit/dom-report.json +++ /dev/null @@ -1,57 +0,0 @@ -{ - "generatedAt": "2026-08-29T04:04:14.643Z", - "reports": [ - { - "route": "/preview/demo", - "ref": "demo.html", - "deltas": [], - "counts": { - "added": 0, - "removed": 0, - "tagMismatch": 0, - "textMismatch": 0, - "nodesAdded": 0, - "nodesRemoved": 0 - } - }, - { - "route": "/preview/list-tools", - "ref": "list-tools.html", - "deltas": [], - "counts": { - "added": 0, - "removed": 0, - "tagMismatch": 0, - "textMismatch": 0, - "nodesAdded": 0, - "nodesRemoved": 0 - } - }, - { - "route": "/preview/tools/linear-gradient-png", - "ref": "gradient.html", - "deltas": [], - "counts": { - "added": 0, - "removed": 0, - "tagMismatch": 0, - "textMismatch": 0, - "nodesAdded": 0, - "nodesRemoved": 0 - } - }, - { - "route": "/preview/tools/remove-background-png", - "ref": "background-remover.html", - "deltas": [], - "counts": { - "added": 0, - "removed": 0, - "tagMismatch": 0, - "textMismatch": 0, - "nodesAdded": 0, - "nodesRemoved": 0 - } - } - ] -} \ No newline at end of file diff --git a/web/audit/dom-report.md b/web/audit/dom-report.md deleted file mode 100644 index 2178da9..0000000 --- a/web/audit/dom-report.md +++ /dev/null @@ -1,47 +0,0 @@ -# DOM audit (phase A) - -_2026-08-29T04:04:14.645Z_ - -## Сводка - -| route | ref | added | removed | tag | text | -|---|---|---|---|---|---| -| `/preview/demo` | demo.html | 0 | 0 | 0 | 0 | -| `/preview/list-tools` | list-tools.html | 0 | 0 | 0 | 0 | -| `/preview/tools/linear-gradient-png` | gradient.html | 0 | 0 | 0 | 0 | -| `/preview/tools/remove-background-png` | background-remover.html | 0 | 0 | 0 | 0 | - -## /preview/demo (vs demo.html) - -- added: **0** (≈0 узл.), removed: **0** (≈0 узл.), tag: **0**, text: **0** - -### Расхождения (топ 0) - -_расхождений нет_ - - -## /preview/list-tools (vs list-tools.html) - -- added: **0** (≈0 узл.), removed: **0** (≈0 узл.), tag: **0**, text: **0** - -### Расхождения (топ 0) - -_расхождений нет_ - - -## /preview/tools/linear-gradient-png (vs gradient.html) - -- added: **0** (≈0 узл.), removed: **0** (≈0 узл.), tag: **0**, text: **0** - -### Расхождения (топ 0) - -_расхождений нет_ - - -## /preview/tools/remove-background-png (vs background-remover.html) - -- added: **0** (≈0 узл.), removed: **0** (≈0 узл.), tag: **0**, text: **0** - -### Расхождения (топ 0) - -_расхождений нет_ diff --git a/web/scripts/archive/audit-cdp-responsive.mjs b/web/scripts/archive/audit-cdp-responsive.mjs deleted file mode 100644 index e66b57b..0000000 --- a/web/scripts/archive/audit-cdp-responsive.mjs +++ /dev/null @@ -1,30 +0,0 @@ -// Runs audit-cdp.mjs across the commonly used desktop / tablet / phone -// resolutions. Same CLI options pass through, e.g.: -// node scripts/audit-cdp-responsive.mjs --route /preview/demo --viewport 390x844 -import { spawnSync } from "node:child_process"; - -const VIEWPORTS = ["2560x1440", "1920x1080", "1440x900", "768x1024", "390x844"]; - -const args = []; -let viewportSeen = false; -for (let i = 0; i < process.argv.length; i++) { - const v = process.argv[i]; - if (v === "--viewport") { - viewportSeen = true; - i++; - } else args.push(v); -} -if (!viewportSeen) args.push("--viewport", VIEWPORTS.join(",")); - -const r = spawnSync( - process.execPath, - ["scripts/audit-cdp.mjs", ...args.slice(2)], - { - stdio: "inherit", - }, -); -if (r.error) { - console.error(r.error.message); - process.exit(1); -} -process.exit(r.status ?? 1); diff --git a/web/scripts/archive/audit-cdp.mjs b/web/scripts/archive/audit-cdp.mjs deleted file mode 100644 index 77e10b7..0000000 --- a/web/scripts/archive/audit-cdp.mjs +++ /dev/null @@ -1,1486 +0,0 @@ -// audit-cdp.mjs -// Visual audit over multiple routes comparing SPECIFIED styles (what the CSS -// actually declares, after cascade + var() resolution + inheritance) instead -// of computed layout values — so sizes driven by differing page content don't -// produce false positives. Geometry (box) is only reported where a dimension -// is explicitly locked by CSS, not where it just follows the content flow. -// Replicates the route→ref mapping from audit-css.mjs (the 4 targets that have -// a corresponding ref HTML file), starts a dev server (unless --no-serve), -// captures each pair, diffs, and writes a report to web/audit/cdp-audit.txt. -// -// Usage: -// node scripts/audit-cdp.mjs # serve + audit all 4 targets -// node scripts/audit-cdp.mjs --no-serve # assume a server is already running -// node scripts/audit-cdp.mjs --ours http://127.0.0.1:5173 -// node scripts/audit-cdp.mjs --route /preview/demo --ref demo.html -import { diffArrays } from "diff"; -import { spawn } from "node:child_process"; -import { mkdirSync, readdirSync, writeFileSync } from "node:fs"; -import { join, resolve } from "node:path"; -import { chromium } from "playwright"; - -// ==== CLI / config ========================================================= - -const args = parseCli(); - -function parseCli() { - const a = { viewports: [] }; - for (let i = 0; i < process.argv.length; i++) { - const v = process.argv[i]; - if (v === "--no-serve") a.noServe = true; - else if (v === "--ours") a.ours = process.argv[++i]; - else if (v === "--ref") a.ref = process.argv[++i]; - else if (v === "--route") a.route = process.argv[++i]; - else if (v === "--port") a.port = Number(process.argv[++i]); - else if (v === "--viewport") - a.viewports.push(...(process.argv[++i] ?? "").split(",").filter(Boolean)); - } - return a; -} - -const WEB = process.cwd(); -const PORT = args.port || 5179; -const REFS_DIR = resolve(WEB, "../refs-html"); -const PX_TOL = 1; -// Per-page navigation timeout (ms). Guards against hanging indefinitely when a -// served URL is unreachable (e.g. --no-serve with no server actually running). -const NAV_TIMEOUT = 20_000; - -// Requested viewports; repeatable/comma-separated "--viewport WxH". -// Deduplicated, preserves order. Defaults to 1440x900 when the flag is absent. -const viewports = parseViewports(); -const vpLabel = (vp) => `${vp.width}x${vp.height}`; - -function parseViewports() { - const raw = args.viewports.length ? args.viewports : ["1440x900"]; - const out = []; - for (const s of raw) { - const m = /^(\d+)x(\d+)$/.exec(s.trim()); - if (!m) { - console.error(`[cdp-audit] invalid viewport: ${s} (expected "WxH")`); - process.exit(1); - } - const vp = { width: +m[1], height: +m[2] }; - if (!out.some((o) => o.width === vp.width && o.height === vp.height)) - out.push(vp); - } - return out; -} - -// Explicit --viewport means per-resolution files; default run keeps the -// backward-compatible single cdp-audit.txt name. -const perResFile = args.viewports.length > 0; -const reportPath = (vp) => - resolve( - WEB, - "audit", - perResFile ? `cdp-audit-${vpLabel(vp)}.txt` : "cdp-audit.txt", - ); - -// Properties snapshot for every node, in both specified and computed form. -const PROPS = [ - "display", - "position", - "top", - "right", - "bottom", - "left", - "z-index", - "float", - "flex-direction", - "flex-wrap", - "justify-content", - "align-items", - "align-self", - "row-gap", - "column-gap", - "grid-template-columns", - "grid-template-rows", - "grid-area", - "grid-column", - "grid-column-start", - "grid-column-end", - "grid-row", - "grid-row-start", - "grid-row-end", - "margin-top", - "margin-right", - "margin-bottom", - "margin-left", - "padding-top", - "padding-right", - "padding-bottom", - "padding-left", - "width", - "height", - "min-width", - "min-height", - "max-width", - "max-height", - "box-sizing", - "overflow", - "opacity", - "visibility", - "transform", - "box-shadow", - "border-top-width", - "border-top-style", - "border-top-color", - "border-right-width", - "border-right-style", - "border-right-color", - "border-bottom-width", - "border-bottom-style", - "border-bottom-color", - "border-left-width", - "border-left-style", - "border-left-color", - "border-radius", - "background-color", - "background-image", - "background-size", - "background-position", - "color", - "font-family", - "font-size", - "font-weight", - "font-style", - "line-height", - "letter-spacing", - "text-align", - "text-transform", - "white-space", - "vertical-align", - "text-decoration", - "text-decoration-line", - "text-decoration-style", - "text-decoration-color", - "text-underline-offset", -]; - -// Tags/elements never included in the snapshot. -const NOISE_TAGS = new Set(["script", "template", "style", "link", "noscript"]); - -// Properties that inherit by default — their specified value flows to children. -const INHERITED = new Set([ - "color", - "cursor", - "direction", - "font-family", - "font-size", - "font-style", - "font-variant", - "font-weight", - "letter-spacing", - "line-height", - "text-align", - "text-indent", - "text-shadow", - "text-transform", - "visibility", - "white-space", - "word-spacing", -]); - -// ==== capture: open a page and snapshot its tree via getComputedStyle ====== - -async function capture(browser, target, viewport) { - const url = target.startsWith("http") - ? target - : "file:///" + target.replace(/\\/g, "/"); - const page = await browser.newPage({ viewport }); - await page.goto(url, { - waitUntil: "networkidle", - // Fail fast instead of hanging when the served URL is unreachable - // (e.g. --no-serve but no server actually running). - timeout: NAV_TIMEOUT, - }); - await page.evaluate(async () => { - await document.fonts.ready; - }); - // Normalize both sides to light theme so we measure real design diffs, - // not a theme inversion. - await page.evaluate(() => { - document.documentElement.dataset.theme = "light"; - }); - // Get deterministic base state: no element under the cursor and no focused - // element, so pointer/keyboard state pseudo-classes (:hover/:focus/:active) - // never match. Hover rules are simply not part of a static snapshot. - await page.mouse.move(-10, -10); - await page.evaluate(() => document.activeElement?.blur?.()); - await page.waitForTimeout(400); - - // Pass Sets as plain arrays (page.evaluate serializes, losing Set-ness) and - // rebuild them inside the browser context. - const tree = await page.evaluate(snapshotDocument, { - PROPS, - NOISE_TAGS: [...NOISE_TAGS], - INHERITED: [...INHERITED], - BOX_GROUPS, - }); - await page.close(); - return tree; -} - -// Browser-side cascade engine. Snapshot the document tree and, for every node, -// compute the SPECIFIED value of each requested property — what the CSS -// declares after cascade + inheritance + var() resolution — alongside the -// computed value from getComputedStyle. Runs inside the page via -// page.evaluate, so it must stay self-contained (browser globals + the arg). -function snapshotDocument({ PROPS, NOISE_TAGS, INHERITED, BOX_GROUPS }) { - // page.evaluate hand-serialized the Sets to plain arrays — restore them. - NOISE_TAGS = new Set(NOISE_TAGS); - INHERITED = new Set(INHERITED); - - // ---- collect author rules (stylesheets) preserving cascade order ---- - // Recurse into container rules AND native CSS nesting (Svelte emits nested - // "& output:where(.svelte-x)" rules whose declarations would otherwise be - // invisible), expanding the "&" reference to the parent selector so the - // rule still matches via el.matches() and parses for specificity. - function collectRules() { - const rules = []; - let ruleOrder = 0; - // Declared cascade-layer order, top-level names only, in declaration - // order (from `@layer a, b;` statements and first appearance of blocks). - // Unlayered author rules are a separate, always-winning tier. - const layerNames = []; - const ensureLayer = (name) => { - if (name && !layerNames.includes(name)) layerNames.push(name); - }; - // `layers` is the cascade-layer path enclosing this rule; [] = unlayered. - const collect = (list, parentSel = "", layers = []) => { - for (const r of list || []) { - if (r == null) continue; - // Layer rules don't expose a reliable numeric .type in this - // Chromium (they report 0), so detect them by constructor. - const ctor = r.constructor?.name; - if (ctor === "CSSLayerStatementRule") { - // @layer a, b; — declares layer order, carries no declarations. - for (const n of r.nameList ?? []) ensureLayer(n); - continue; - } - if (ctor === "CSSLayerBlockRule") { - // @layer name { ... } — recurse with the layer appended. - ensureLayer(r.name); - const next = r.name ? [...layers, r.name] : layers; - try { - collect(r.cssRules, parentSel, next); - } catch {} - continue; - } - if (r.type === 1) { - let sel = r.selectorText; - if (parentSel && sel?.includes("&")) - sel = sel.replace(/&/g, parentSel); - rules.push({ rule: r, effective: sel, order: ruleOrder++, layers }); - if (r.cssRules?.length) collect(r.cssRules, sel ?? parentSel, layers); - } else if (r.type === 3 && r.styleSheet) { - try { - collect(r.styleSheet.cssRules, parentSel, layers); - } catch {} - } else if (r.type === 4) { - if (r.media?.matches) { - try { - collect(r.cssRules, parentSel, layers); - } catch {} - } - } else if (r.type === 12) { - try { - if (CSS.supports(r.conditionText)) - collect(r.cssRules, parentSel, layers); - } catch { - try { - collect(r.cssRules, parentSel, layers); - } catch {} - } - } else if (r.type === 15) { - try { - collect(r.cssRules, parentSel, layers); - } catch {} - } - } - }; - for (const sheet of document.styleSheets) { - try { - collect(sheet.cssRules); - } catch {} - } - // Layer rank: unlayered rules (empty path) always outrank layered ones; - // layered rules win by the position of their OUTERMOST layer in the - // declared order (later-declared layer wins over earlier). - const rankOf = (layers) => - layers.length ? layerNames.indexOf(layers[0]) : Number.MAX_SAFE_INTEGER; - for (const rl of rules) rl.layerRank = rankOf(rl.layers); - return rules; - } - - // ---- selector specificity (approximation of the CSS algorithm) ---- - // ids, classes, attributes, elements, plus :is/:not/:has (max of args) - // and :where (zero). - function splitTop(s, sep) { - const parts = []; - let depth = 0, - cur = ""; - const isSep = (ch) => - sep === "," - ? ch === "," - : ch === ">" || ch === "+" || ch === "~" || /\s/.test(ch); - for (const ch of s) { - if (ch === "(" || ch === "[") depth++; - else if (ch === ")" || ch === "]") depth--; - if (depth === 0 && isSep(ch)) { - if (cur.trim()) parts.push(cur.trim()); - cur = ""; - } else cur += ch; - } - if (cur.trim()) parts.push(cur.trim()); - return parts; - } - - function specCompound(full) { - let [A, B, C] = [0, 0, 0]; - for (const comp of splitTop(full, " ")) { - const n = comp.length; - let i = 0; - const ident = (ch) => /[\w\u00A0-\uFFFF-]/.test(ch); - const readName = () => { - let o = ""; - while (i < n && ident(comp[i])) o += comp[i++]; - return o; - }; - const endParen = () => { - let d = 1; - i++; - while (i < n) { - if (comp[i] === "(" || comp[i] === "[") d++; - else if (comp[i] === ")") { - d--; - if (!d) return i; - } - i++; - } - return n; - }; - while (i < n) { - const ch = comp[i]; - if (ch === "#") { - A++; - i++; - readName(); - } else if (ch === ".") { - B++; - i++; - readName(); - } else if (ch === "*") i++; - else if (ch === "[") { - B++; - while (i < n && comp[i] !== "]") i++; - i++; - } else if (ch === ":") { - if (comp[i + 1] === ":") { - C++; - i += 2; - readName(); - } else { - i++; - const name = readName(); - if (comp[i] === "(") { - const inner = comp.slice(i + 1, endParen()); - // :is/:not/:has take the most specific argument. - if (name !== "where") { - let a = 0, - b = 0, - c = 0; - for (const arg of splitTop(inner, ",")) { - const [aa, bb, cc] = specCompound(arg); - a = Math.max(a, aa); - b = Math.max(b, bb); - c = Math.max(c, cc); - } - A += a; - B += b; - C += c; - } - } else B++; - } - } else if (/[a-zA-Z]/.test(ch)) { - C++; - readName(); - } else i++; - } - } - return [A, B, C]; - } - - // ---- cascade resolution ---------------------------------------------- - // All declarations that apply to `el`, in cascade terms. - // ---- declaration parsing + shorthand expansion ------------------------ - // Reading longhands off a rule misses shorthands: e.g. a rule written - // `font: 600 14px var(--font-mono)` yields an EMPTY font-size/font-weight/ - // font-family on enumeration (getPropertyValue), and the browser even - // refuses to expand `font` inline when it contains a var(). So we parse the - // raw declaration text and expand shorthands into longhands — font by hand, - // everything else via a detached element whose cssText the browser expands. - const _tmp = document.createElement("div"); - - // Split a declaration block ("a:1; b:2") on top-level ';', ignoring braces, - // parens and quoted strings (so "content:';'" and var(...) survive). - function parseDecls(cssText) { - const parts = []; - let depth = 0, - cur = "", - inStr = null; - for (const ch of cssText) { - if (inStr) { - cur += ch; - if (ch === inStr) inStr = null; - continue; - } - if (ch === '"' || ch === "'") { - inStr = ch; - cur += ch; - continue; - } - if (ch === "(" || ch === "[") depth++; - else if (ch === ")" || ch === "]") depth--; - if (ch === ";" && depth === 0) { - if (cur.trim()) parts.push(cur.trim()); - cur = ""; - } else cur += ch; - } - if (cur.trim()) parts.push(cur.trim()); - return parts; - } - - // font — needs manual parsing: the browser can't expand it when a var() - // appears (commonly in the family), so enumerate longhands by substituting - // a plain family and reading back the resolved font sub-properties. - // Grammar: [