Kajabi X-Ray

Hover any Kajabi page for block and section IDs, image URLs, colours and fonts, and fit CSS snippets in one click.

Kajabi X-Ray shows you what's inside any Kajabi page: block and section IDs, every image URL, the page's colours and fonts, and a CSS snippet library that fits itself to the block you choose. Hover, click, copy. No DevTools, no digging through HTML. Built by web designers who work in Kajabi every day, for the jobs we do most: writing custom code for sales pages, finding the right block and section IDs, collecting image links, and matching a creator's brand. ━━━━━━━━━━━━━━━━━━━━ HOW IT WORKS ━━━━━━━━━━━━━━━━━━━━ 1. Open any Kajabi page, or a page in the Kajabi editor. 2. Click the X-Ray icon, or press Alt + Shift + X (Windows) / Option + Shift + X (Mac). 3. Hover anything. A mint outline marks the block and a coral outline marks its section, with a tooltip showing the font, colours and contrast. 4. Click to copy the block ID. Shift + Click copies the section ID. Alt + Click (Option + Click on Mac) copies the exact element selector. While you inspect, clicks never reach the page, so links, buttons and checkouts don't fire. Press I or Esc to pause and use the page normally. ━━━━━━━━━━━━━━━━━━━━ FIVE TABS ━━━━━━━━━━━━━━━━━━━━ INSPECT: everything about the block you clicked • Block ID, section ID and exact element selector, each with a copy button • Font family, size, weight and line height • Text and background colours with the WCAG contrast ratio and an AA / AAA check • Size, padding, margin, radius, and the image URL if there is one SECTIONS: the whole page as a map of IDs • Every section in order, named by its heading • Every block inside it, with its ID and type (Text, Image, Button…) • Search, click to scroll to a block, or copy the whole map as text IMAGES: every image URL on the page • Images, background images, video posters and the social share image • Size, file weight and the block each image sits in • Copy one URL or all of them • Clean URLs (on by default) removes the signature from Kajabi image links so copied URLs don't expire after 7 days • Oversized images are flagged STYLE: the creator's brand, read from the page • Background, text, accent and button colours • The full palette, ranked by use • Every font with its weights and sizes, plus the heading-to-paragraph type scale • HEX, RGB or HSL, and an eyedropper for any colour on screen • Export everything as CSS variables in one click SNIPPETS: CSS that fits itself to any block • Pick a block on the page, choose a snippet, and X-Ray fills in the placeholders: {{BLOCK}}, {{SECTION}}, {{ACCENT}}, {{BG}}, {{TEXT}}, {{BUTTON}}, {{COLOR_1}}…{{COLOR_8}}, {{FONT_HEADING}}, {{FONT_BODY}} • Preview it live on the page. Only you can see the preview. • Copy the fitted CSS or JS and paste it into the page's Custom Code • Add your own snippets, edit or duplicate them, and delete any snippet, including the starters • Share a snippet set with your team through Export and Import ━━━━━━━━━━━━━━━━━━━━ WHERE IT WORKS ━━━━━━━━━━━━━━━━━━━━ • Live Kajabi pages, including custom domains • Inside the Kajabi page editor preview • Any other website, in a simpler mode that shows element IDs ━━━━━━━━━━━━━━━━━━━━ YOUR SNIPPETS ARE SAVED FOR GOOD ━━━━━━━━━━━━━━━━━━━━ Every snippet you add, edit or delete is saved straight away in your own browser and stays through Chrome restarts and updates. Each person's library is their own, and changing yours never affects anyone else's. ━━━━━━━━━━━━━━━━━━━━ PRIVATE BY DESIGN ━━━━━━━━━━━━━━━━━━━━ • No account, no sign-up, no server • No analytics or tracking • X-Ray runs only on the tab where you turn it on • It never changes the page: previews are visible only to you and disappear when you close X-Ray • Your snippets and settings stay in Chrome's storage on your device. If Chrome Sync is on, a backup copy is kept in your own Chrome Sync. ━━━━━━━━━━━━━━━━━━━━ STRESS-TESTED ━━━━━━━━━━━━━━━━━━━━ Passes 26 extreme tests, including pages with 45,000 blocks and 3,000 images, attack code in IDs and headings, pages that block mouse and keyboard events, strict security policies, the Kajabi editor's nested frames, pop-up dialogs, phone-size and 4K windows, and 100 on/off cycles with no leftovers. ━━━━━━━━━━━━━━━━━━━━ KEYBOARD SHORTCUTS ━━━━━━━━━━━━━━━━━━━━ Turn on / off: Alt + Shift + X (Windows) · Option + Shift + X (Mac) Copy block ID: Click Copy section ID: Shift + Click Copy exact element: Alt + Click (Windows) · Option + Click (Mac) Parent / child element: ↑ / ↓ Pause / resume: I Pause, then close: Esc You can change the on/off shortcut at chrome://extensions/shortcuts. Kajabi X-Ray is an independent tool and is not affiliated with or endorsed by Kajabi.