Over.fig - a free Chrome extension that overlays your Figma design as a semi-transparent layer directly into your webpage.
Bridge the gap between design and code. Compare design to website in one click.
No more switching tabs. No more guessing margins, fonts, or colors. And no more static image overlays that limit interaction.
Access Figmaโs precise measurement tools โ without leaving your website. Hover over any element and instantly see spacing, padding, and alignment. Verify every detail directly on the live page. No more tab-switching, no more guessing.
Instant check design CSS & Tailwind conversion. Click any design element to inspect its styles and transform Figma styles into Tailwind utility classes on the fly.
Overlay only the frame that you need. Need to use only a header, card, or CTA section? Select any frame or group in Figma, overlay just that part, and use it as a reference while coding.
Download optimized assets instantly. Images, icons, illustrations โ download them directly from the extension in optimized formats, ready for the web.
Pixel-perfect comparison: Overlay Figma designs on live sites to instantly spot visual mismatches.
Real-time inspection: Check spacing, alignment, and sizes directly in the browser without switching tabs.
One-click code copy: Grab clean CSS or Tailwind classes from any inspected element instantly.
Component-level focus: Select and compare only the frames or elements you need from Figma.
Optimized asset export: Download ready-to-use, web-optimized images and icons straight from Figma.
Seamless workflow: Eliminate context switching between design and development tools.
Faster handoff: Reduce back-and-forth between designers and developers during implementation.
Consistent layouts: Ensure pixel-perfect spacing, typography, and element alignment.
Visual accuracy: Deliver websites that perfectly match the original design.
RealityMAX is the go-to platform for product visualization, 3D design collaboration, and augmented 3D printing and prototyping. Generate a 3D version of a 2D image with a click (even a sketch on paper!), upload your models (we support all formats), or pick an object from our vast library. Edit your objects as much as you need and create Smart Materials that adapt automatically as you transform them. Leverage our AI ReIMAGINE enhancer to optimize and elevate your visuals. Invite teammates and clients to work with you in the same virtual environment. Download your scenes as 3D-printable files to make physical prototypes on the fly or products to sell. Share your creations as a Web 3D or AR experience with call-to-action buttons. Insert interactive 3D in your website or app easily with a copy-and-paste embed code. Track visits to your scenes.
No features have been listed yet.
Over.fig's answer
Web Developers, Designers, Quality Assurance
Over.fig's answer
As the creator behind Over.fig, I, Anton Khodakovskii, developed this free Chrome extension out of my own frustration with the friction between Figma designs and live websites. My goal was to bridge that gap, empowering developers and designers with a seamless way to achieve pixel-perfect implementations by directly overlaying Figma designs onto live webpages. Over.fig is my dedicated effort to streamline the workflow, eliminate tedious tab-switching, and ensure visual accuracy right in the browser, ultimately making the design-to-code handoff faster and more precise for everyone building for the web.
Over.fig's answer
Angular, Express JS, Supabase, Sentry, Logtail, Google Analytics, Custom Web Elements
RealityMAX takes 3D collaboration to the next level. Beyond its smooth browser-based viewer, it packs cutting-edge features like AR previews (see models in the real world straight from your device) and AI-powered tools. The Image-to-3D feature lets you create 3D models from simple images, while AI Reimagine transforms existing models with new styles or variations in seconds. Itโs like having a 3D design studio in your browser.
Great for editing models and putting together complex scenes directly in the browser. I have used it for several interior design projects and it worked smoothly all the time. Also cool that you can share your stuff in augmented reality with a couple of clicks. That made my clients go crazy >D
RealityMAX is a free 3D editing platform for professionals that lets users visualize their models online, safeguard their copyright, and output in AR, Web AR, and VR. Its real-time collaboration feature makes it ideal for professionals like architects, designers, and engineers. Additionally, it allows easy editing of materials and models, making it a go-to solution for anyone needing a powerful and user-friendly platform.