# Aligner

> Free MIT-licensed Chrome extension for visual design, measurement, quality checks, and WordPress builder tools.

- Website: https://gtarafdar.github.io/aligner/
- Source: https://github.com/Gtarafdar/aligner
- Latest ZIP: https://github.com/Gtarafdar/aligner/releases/latest/download/aligner.zip
- Helper ZIP: https://github.com/Gtarafdar/aligner/releases/latest/download/aligner-wp-tools-helper.zip
- License: MIT
- Author: Gobinda Tarafdar (https://gtarafdar.com/bio/)

## Summary

Aligner runs in Chrome (Manifest V3). Settings stay on the user’s device. No account. No analytics endpoint ships in the repository.

## Who it’s for

- UI & layout designers — rulers, guides, grids, measure for aligned layouts
- Responsive work — device-width preview beside the tool grid
- Front-end polish — Inspect for box model, CSS, contrast without DevTools overload
- Structure reviews — Wireframe grayscale structural preview
- Media / content — Media Manager to scan and download page images
- Brand / visual QA — Color Picker and Palette from the live UI
- Accessibility reviewers — automated a11y audit with severity filters
- Performance-minded designers — Page Speed / Core Web Vitals on the live page
- QA & testers — Page Controls, Fake Filler, Cache Cleaner
- WordPress developers — WP Tools suite (roles, ACF, notices, sidebar, menu search)
- AI IDE workflows — Design System exports DESIGN.md / SKILL.md

## Standout capabilities

- One-click extension on/off and This tab / All tabs scoping
- Inspect & edit: box model, CSS, structure, contrast, typography
- Design System exports DESIGN.md / SKILL.md for AI IDEs (Cursor, Claude, Codex)
- Cache Cleaner for per-site cache, cookies, storage, service workers
- Page Controls with Fake Filler for QA form testing
- WordPress suite: Role switcher, Theme switcher, ACF Tools, admin menu search, hide notices, sidebar shrink, smart editor, detector, backlog, Classic Customizer

## Feature inventory

### Layout
- Rulers — pixel rulers on the viewport edges
- Guides — alignment lines you place and lock
- Grids — column and baseline overlays
- Measure — point or rectangle distances and area
- Drawing — temporary arrows, shapes, and notes

### Inspect
- Inspect — box model, type, and element details
- Responsive — device-width preview for common sizes
- Wireframe — grayscale structural page view

### Color & media
- Color Picker — eyedropper with HEX, RGB, HSL history
- Palette — extract and save colors from the page
- Media — scan, preview, and download images / SVG / video

### Quality
- Accessibility — automated a11y audit with severity filters
- Design Check — typography, color, and spacing consistency
- Page Speed — Core Web Vitals and performance score
- Design System — extract tokens; export DESIGN.md / SKILL.md

### Utilities
- Cache Cleaner — clear site browsing data selectively
- Page Load Timer — navigation timing and paint milestones
- Page Controls — temporarily disable images, JS, popups, and more

### WordPress (WP Tools)
- Admin bar toggle, Admin / front switcher, Smart page editor
- Role switcher (needs Aligner WP Tools Helper)
- Theme switcher / private preview (needs helper)
- ACF Tools, Theme & plugin detector, Update backlog
- Admin menu search, Hide admin notices, Classic Customizer, Sidebar shrink

### Workspace presets
All tools · Designer · WordPress · QA · Minimal — hide popup groups without deleting saved settings.

## Install

1. Download aligner.zip from GitHub Releases.
2. Unzip permanently.
3. chrome://extensions → Developer mode → Load unpacked → select folder with manifest.json.
4. Updates: re-download latest ZIP and Reload the extension (Store auto-update only after a Web Store listing).

## For humans

Prefer the landing page: https://gtarafdar.github.io/aligner/

## Related projects by the same maker

- WPBakery — https://wpbakery.com/
- Docscriber — https://thedocscriber.com/
- TheRecaller — https://therecaller.com/
- TheEditra — https://theeditra.com/
- The Quill Press — https://thequillpress.com/
- Costlas — https://costlas.com/
- Auto AFK Slack — https://gtarafdar.github.io/auto-afk-slack/
- Slack Teammate Time — https://gtarafdar.github.io/slack-teammate-local-time/
- FinderFlow — https://gtarafdar.github.io/FinderFlow/
- Slack Agent Bridge — https://gtarafdar.github.io/slack-agent-bridge/
- Broken Link Checker — https://gtarafdar.github.io/broken-link-checker/