2xBRAll tools ↗
TOOLS / CATEGORY / DESIGN / V20

System before
decoration.

Code-native workspaces for the repeatable decisions behind interface design: color, gradient, type, layout, elevation and texture.

06 SUITE TOOLS11 DESIGN TOOLS100% LOCAL
DESIGN SUITE / SHARED LOGIC

Build the rules.
Export the system.

Every workspace connects visual judgment to an inspectable CSS artifact, so the result can move from exploration into production.

65 / DESIGN LIVE

LAB

Render one public URL in clean managed Chromium, Firefox, WebKit and Chromium mobile-emulation cells, compare viewport screenshots and surface HTTP, runtime, request and overflow differences.

URL / MATRIX / RENDER / REVIEWOPEN →
54 / DESIGN LIVE

ASSETS

Inventory the public resources a website actually references across HTML and CSS, deduplicate images/SVG/icons/fonts/styles/scripts/media, then download a selected clean package with original URLs and SHA-256 manifest.

DISCOVER / SELECT / PACKAGEOPEN →
47 / DESIGN LIVE

SIGNPAD

Turn a phone or tablet into this computer's handwriting pad: pressure-aware local strokes, undo/clear, transparent PNG or SVG and verified WebRTC return with no app install.

PHONE / INK / PNG / SVG / WEBRTCOPEN →
19 / DESIGN LIVE

Color System

Build a brand scale, test foreground contrast and export reusable CSS color tokens.

PALETTE / WCAG / TOKENSOPEN →
20 / DESIGN LIVE

Gradient Studio

Compose three-stop linear or radial gradients with a live preview and CSS export.

LINEAR / RADIAL / CSSOPEN →
21 / DESIGN LIVE

Type Scale

Generate a modular typography scale with rem tokens, font stack and line-height controls.

REM / RATIO / TOKENSOPEN →
22 / DESIGN LIVE

Grid Studio

Design a responsive column grid and export practical container and CSS Grid rules.

COLUMNS / GUTTER / CONTAINEROPEN →
23 / DESIGN LIVE

Shadow Studio

Tune layered box shadows, preview elevation and export exact CSS values.

ELEVATION / LAYERS / CSSOPEN →
24 / DESIGN LIVE

Pattern Studio

Generate grid, dot or diagonal CSS textures without a raster background asset.

GRID / DOTS / DIAGONALOPEN →
CONNECTED TOOLS

Assets and install surfaces.

Image Lab and Manifest Studio remain part of the wider DESIGN category and connect asset production to the new system tools.

01Image LabWEBP / JPEG / PNG17Manifest StudioPWA / JSON / INSTALL