← Back to blog

My Favorite Tools for Vibe Coding

12 min read
Cinematic enterprise hero image representing Vibe Coding — an AI innovation lab bathed in soft volumetric light.

I’ve shipped a fair amount of software by vibe coding — describing what I want in plain language and steering AI until the thing actually works. Along the way I’ve collected a short list of tools I now refuse to work without. Not because they’re trendy, but because each one closes a specific gap between “the AI made something” and “the AI made something I’d actually put my name on.”

This is that list. And it starts with the one that surprised me most: Impeccable.

Impeccable: the tool that makes AI stop designing like AI

If you’ve built anything with AI, you know the look. The generic look. Centered hero, a couple of rounded cards, a purple-to-blue gradient nobody asked for, body text in a washed-out gray you can barely read. It works, technically — but it screams “an AI made this,” and nothing undercuts credibility faster.

Impeccable is the tool that fixed that for me. It’s a design skill — a package of hard-won frontend craft that the AI reads and follows before it writes a single line of interface. Instead of reaching for its default instincts, the AI works from a set of opinionated, professional rules about color, typography, layout, spacing, motion, and accessibility.

Why?What actually is a 'skill' here?

A skill is a structured bundle of instructions and references the AI loads on demand when a task matches its domain. Impeccable’s skill covers frontend design — so when I ask for a page or a component, the AI first reads the design guidance and then builds, rather than improvising from whatever it half-remembers. Think of it as handing your AI a senior designer’s playbook before it touches the canvas.

Why it’s beneficial

The value is easiest to see in the specifics it enforces:

  • Real contrast, readable text. One of the most common AI design failures is light-gray body text on a tinted near-white background. Impeccable insists on proper contrast ratios, so the text is actually legible instead of “elegant” and unreadable.
  • Typography with intent. Sensible line lengths, font pairings that contrast instead of clashing, heading sizes that don’t shout. The stuff that separates a designed page from a defaulted one.
  • Layout beyond the card grid. Cards are the lazy answer, and the AI loves them. Impeccable pushes toward layouts that fit the content — grids where grids belong, flex where flex belongs, and rhythm in the spacing.
  • Motion that’s intentional. Purposeful micro-interactions with proper easing and a prefers-reduced-motion fallback — not bounce-everywhere animation or, worse, none at all.
  • Accessibility baked in, not bolted on. Contrast, focus states, semantic structure. The things you’re supposed to do and usually skip.

The result: interfaces that look like a person with taste built them. For a non-designer like me, that’s the difference between a project I quietly keep to myself and one I’m comfortable shipping in public. If you build UI with AI and you’re not using something like this, start here — it’s the single biggest quality jump I’ve found.

Why?Do I need to be a designer to use it?

No — that’s the whole point. I’m not a designer. The skill carries the design judgment so I don’t have to. I describe the outcome, it applies the craft, and I steer with plain-language feedback like “make this quieter” or “the hero is shouting.” It also works the other direction: point it at an existing page and ask it to audit or polish what’s already there.

The rest of the toolkit

Impeccable handles how things look. These are the tools that handle everything around it.

Astro: the framework I build blogs on

Impeccable makes the interface look right, but something has to actually be the site underneath it. For blogs — including this one — that’s Astro. It’s a web framework built for content-heavy sites, and it’s become my default for anything that’s mostly words: blogs, docs, landing pages, portfolios.

Two things make it a great fit for vibe coding a blog:

  • Content-first by design. Astro treats Markdown and MDX as first-class citizens, so I can write posts in plain .mdx files, drop in a component like Explain when I need one, and Astro handles the routing, the RSS feed, and the build. The AI and I spend our time on content and design, not plumbing.
  • Fast by default. Astro ships zero JavaScript to the browser unless a component actually needs it — its “islands” model hydrates only the interactive bits and sends the rest as plain HTML. The result is pages that load instantly and score well on performance and SEO without me hand-tuning anything.
Why?Why is Astro so popular right now?

It hits a sweet spot: the developer experience of a modern framework with the speed of a static site. You can pull in components from React, Vue, Svelte, or just write plain Astro, and it still ships lean HTML. For content sites — where performance and SEO matter more than heavy interactivity — that combination is hard to beat, which is why it’s become a go-to for blogs and documentation.

Picking the right model

Not every task wants the same model. For planning, architecture, and gnarly debugging I reach for the strongest reasoning model I have access to. For fast, mechanical edits, a quicker model keeps the loop tight. Knowing when to switch is half the skill — a heavyweight model on a trivial rename is slow, and a lightweight model on a subtle bug will confidently lead you off a cliff.

Warp: a terminal that vibe codes with you

Vibe coding still lives in a terminal — installing packages, running builds, wrangling Git — and the terminal is where a non-developer feels least at home. Warp is the tool that made that part comfortable. It’s a modern, AI-native terminal that behaves less like a 1980s command line and more like a place you actually want to work.

What earns it a spot on this list:

  • Agentic AI built in. Warp isn’t just a terminal with a chatbot bolted on — you can describe what you want in plain English and it figures out the commands, runs them, reads the output, and iterates. When a build fails, it can read the error and propose the fix right there, without me copy-pasting stack traces into a separate window.
  • Natural-language to commands. Instead of remembering the exact git or docker incantation, I describe the goal and Warp drafts the command for me to review before running. For someone who lives in PowerShell but not much else, that’s a huge unlock.
  • Blocks, not a wall of text. Warp groups each command and its output into a tidy “block” you can collapse, copy, or share — so scrolling back through a long session is actually readable instead of an undifferentiated stream.
  • Modern editing and workflows. A real text editor for your command line, reusable saved commands, and shareable workflows mean less fumbling and fewer typos on the long, fiddly commands.
Why?Why does the terminal matter for vibe coding?

Because it’s where the AI’s plans meet reality. Plans and code are cheap; the terminal is where things actually run, fail, and get fixed. A terminal that can read its own errors and suggest the next step keeps that loop tight — and it lowers the single biggest barrier for technical-adjacent folks, who often stall the moment a red error message scrolls past.

The GitHub Copilot app: vibe coding without the editor

For a long time, every change I wanted started the same way: open VS Code, wait for it to load, find the project, then describe what I wanted. The GitHub Copilot app quietly deleted that ritual — and with it, a surprising amount of my dependence on the editor.

The app hands you Copilot’s coding agent from wherever you already are: the web, your phone, or GitHub itself. Instead of sitting in front of an editor, I describe a change in plain language, the agent goes off and does the work on a branch, and it comes back with a pull request I review and approve. The editor stops being the place I start; it becomes the place I go only when I want hands-on, line-by-line control.

What earns it a spot on this list:

  • Coding from anywhere, no editor required. I kick off real changes from a browser tab or my phone — a fix I thought of away from my desk becomes a request I fire off in seconds, and the agent handles it while I’m doing something else.
  • The pull request is the interface. The agent does the work on a branch and opens a PR, so my job shifts to reviewing a clean diff and approving it — exactly the reviewer-in-the-loop habit I already preach, now built into the workflow instead of bolted on.
  • VS Code becomes a choice, not a requirement. I still reach for the editor when a task genuinely needs me in the weeds. But a huge share of my day-to-day changes never touch it anymore, which means I can make progress on a project from a device that could never run a full dev environment.
Why?How is this different from Copilot inside VS Code?

Inside VS Code, you’re driving — the AI assists while you sit in the editor. The Copilot app flips that: you delegate a task to the coding agent, it works asynchronously on a branch, and you review the result as a pull request. One is a copilot at your side; the other is more like handing work to a teammate and checking their PR when it’s ready. For me, that’s what cut down how much time I actually spend in the editor.

The Microsoft Learn MCP

Models train on a snapshot of the world, and in the Microsoft ecosystem that snapshot goes stale fast. The Microsoft Learn MCP lets the AI pull the current official documentation instead of half-remembering how a service worked a year ago. The answers stop being “probably right” and start being actually right — with sources. If you work in the Microsoft world and wire up only one MCP, make it this one.

The Azure MCP

The Azure MCP grounds the AI in real Azure context instead of generic examples, and it ships an Azure best-practices tool the AI can call before it writes or deploys. That means secure defaults — managed identities, Key Vault, least-privilege roles — instead of the hard-coded-secret shortcuts a model reaches for on its own. I make a habit of telling it to check Azure best practices first and I lead my instructions with security so it stays the priority.

A reviewer in the loop

The lesson that scared me straight: builder AIs will hand you code that works in the demo and quietly hides a security hole. On one project a dedicated reviewer — an AI whose only job was responsible-AI and security — caught eight components rendering untrusted HTML straight into the page with no sanitization. A live cross-site-scripting hole the demo would never surface. Now a reviewer pass is non-negotiable on anything I ship publicly.

Squad: a whole AI team, not one assistant

A reviewer in the loop is one specialist doing one job. Squad takes that idea and runs with it. It’s an open-source framework for standing up a team of AI agents for any project — a lead, a frontend, a backend, a tester, a reviewer — that live in your repo, coordinate the work, and hand tasks back and forth instead of you narrating everything to a single general-purpose assistant.

What earns it a spot:

  • A persistent cast, not a fresh stranger every session. The team and its roles live in the repo, so each agent stays in its lane and picks up context the next time instead of starting cold.
  • Real handoffs. Work routes to the specialist that should own it — the tester writes tests, the reviewer reviews — rather than one model half-doing every role at once.
  • Review gates built in. The reviewer-in-the-loop habit I keep preaching stops being something I remember to do and becomes something the structure enforces.

It’s the natural next step once you’ve felt how much a single dedicated reviewer changes the output: instead of bolting on judgment one specialist at a time, you start with a team that has it baked in.

Power Platform Skills: every Power Platform plugin in one install

If you build on Microsoft Power Platform, the Power Platform Skills repo is the plugin marketplace for GitHub Copilot (and Claude Code). It bundles every available skill — Power Pages, Model-driven Apps, Canvas Apps, Code Apps, Copilot Studio, ALM, and more — so the AI can scaffold, deploy, and manage Power Platform solutions through natural-language prompts instead of you memorizing each service’s quirks.

One command installs the lot:

iwr https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js -OutFile install.js; node install.js; del install.js

After that, the plugins auto-update and you can start building Power Platform apps by describing what you want.

The through-line

Every tool on this list does the same thing from a different angle: it closes the gap between what an AI produces on instinct and what a professional would actually approve. Impeccable closes it on design. The right model closes it on reasoning. MCPs close it on facts and secure defaults. A reviewer — or a whole Squad of them — closes it on safety.

Vibe coding isn’t about walking away and letting the AI cook. It’s about surrounding the AI with enough good judgment — some of it yours, most of it borrowed from tools like these — that what comes out the other end is something you’re proud to publish.

If you’re just getting started, begin with Impeccable. It’s the fastest way to stop your projects from looking like every other AI demo on the internet. Then reach out and tell me which tools earned a permanent spot in your own toolkit — I’m always looking to add to mine.

Get the latest learnings

Occasional notes on Azure, AI, and cloud architecture. No spam, unsubscribe anytime.

Comments