Item logo image for Raykit

Raykit

Item media 2 (screenshot) for Raykit
Item video thumbnail
Item media 2 (screenshot) for Raykit
Item video thumbnail
Item video thumbnail
Item media 2 (screenshot) for Raykit

Overview

One tool at a time — precision design tools in your browser. Press Cmd+Shift+K (customizable) to open.

Raykit brings a Figma-like command palette to every website so you can inspect, measure, and capture without leaving the page. Toggle the palette with Cmd+Shift+K (Ctrl+Shift+K on Windows/Linux) to open focused tools built for product designers and front-end engineers. Key tools: • Spacing: snap distances between elements with pixel-accurate overlays. • Ruler: horizontal/vertical rulers with draggable guides. • Typography: read font stacks, weights, sizes, and line-height inline. • Contrast: WCAG contrast checker on hover with pass/fail badges. • Style Guide: extract colors, text styles, and assets from the current page. • Image Extractor: grab inline/background images and download in one click. • Element Shot: capture selected elements or full pages; auto-names files. • Breakpoint Snapshots: batch screenshots at custom widths for responsive QA. Why teams use it: fast keyboard workflow, zero sign-up, runs entirely in the browser, and cleans itself up with Esc.

Details

  • Version
    1.3.0
  • Updated
    February 23, 2026
  • Offered by
    shubhambhatt.mailbox
  • Size
    77.15KiB
  • Languages
    English
  • Developer
    Email
    shubhambhatt.mailbox@gmail.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

Manage extensions and learn how they're being used in your organization
The developer has disclosed that it will not collect or use your data.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

Related

Dimensions

4.2

A tool for designers to measure screen dimensions

RocketPen Website to Figma

5.0

Free website to Figma converter: capture any webpage or HTML element as editable Figma designs.

Metric Spy Page Ruler

5.0

Quickly Measure Elements on Web Pages with a Ruler Tool, Free Selection, and Convenient Keyboard Shortcuts.

SpacingJS

4.3

Precision spacing measurement tool for web developers and designers. Hold Alt/Option key and hover over elements to measure.

RTL Text Fixer

5.0

A dedicated RTL Element Inspector (Ctrl+Shift+E) and popup tool to fix Arabic & RTL text.

Copy web to Figma - Copy as editable design, no Figma plugin required

5.0

One-click copy web pages to editable Figma designs, supports any website, no Figma plugin needed, free to use

Designer Tools

4.6

A collection of tools to help you design and develop websites with precision.

Over.fig – Compare design to website in real time

4.6

Bridge the gap between design and code. Convert your Figma into a pixel-perfect semi-transparent overlay directly on your web page.

Better Ruler

4.8

A page ruler which can snaps around web elements for easier measurement. Provide convenience for front-end development and ui design

VisBug

4.8

Open source browser design tools

Web to Figma Paste(Pixel-Perfect Web to Figma Design)

5.0

Capture webpage and copy Figma-compatible clipboard payload directly from Chrome extension.

Quad Tabs - Split your Browser

0.0

Convert four tabs into separate browser windows with Alt+Shift+Q and remembers the layout per display.

Dimensions

4.2

A tool for designers to measure screen dimensions

RocketPen Website to Figma

5.0

Free website to Figma converter: capture any webpage or HTML element as editable Figma designs.

Metric Spy Page Ruler

5.0

Quickly Measure Elements on Web Pages with a Ruler Tool, Free Selection, and Convenient Keyboard Shortcuts.

SpacingJS

4.3

Precision spacing measurement tool for web developers and designers. Hold Alt/Option key and hover over elements to measure.

RTL Text Fixer

5.0

A dedicated RTL Element Inspector (Ctrl+Shift+E) and popup tool to fix Arabic & RTL text.

Copy web to Figma - Copy as editable design, no Figma plugin required

5.0

One-click copy web pages to editable Figma designs, supports any website, no Figma plugin needed, free to use

Designer Tools

4.6

A collection of tools to help you design and develop websites with precision.

Over.fig – Compare design to website in real time

4.6

Bridge the gap between design and code. Convert your Figma into a pixel-perfect semi-transparent overlay directly on your web page.

Google apps