I built an offline, lightweight VS Code extension to preview responsive designs in real device frames

Source: Dev.to

Introduction

I often found myself frustrated by switching back and forth between VS Code and heavy browsers just to check if my UI was responsive. It broke the flow and consumed too much RAM, so I built ViewPort — a VS Code extension that lets you preview your HTML/CSS/JS in real device frames directly inside your editor.

Features

• 100 % Offline – Everything runs locally on your machine.
• Privacy First – Zero telemetry or data tracking; your code stays yours.
• Real Device Frames – Accurate CSS dimensions for devices like iPad, Pixel, and Desktop.
• Lightweight – Doesn’t hog your system resources.

Installation

You can install it directly from the VS Code Marketplace:

Download ViewPort Here

Feedback

I would love to hear your thoughts, feedback, or any feature requests you might have. Let me know what you think!