What Is Quick Blade?
Quick Blade is a macOS Quick Look extension built by Tim Gavin that lets you preview .blade.php files directly inside Finder. Select any Blade template, press the space bar, and you get a rendered visual preview of the page — no running dev server, no database connection, and no network access required. Everything is read straight from disk.
What Quick Blade Does with a Template
When you trigger a Quick Look preview on a Blade file, Quick Blade performs several steps to produce a meaningful visual output:
- Resolves the layout — finds and applies the surrounding layout file
- Inlines compiled CSS — embeds your project's compiled stylesheet
- Converts Blade directives to HTML — processes
@if,@foreach, and other directives - Fills echoes with stand-in data — substitutes placeholder values for
{{ $variable }}expressions - Styles Flux and Livewire tags — applies visual treatment to component tags from those libraries
- Draws Finder thumbnails — generates thumbnail previews visible in icon view
How Layout Detection Works
Quick Blade locates the Laravel project root relative to the file you open. It then searches for the layout using three strategies, in order:
- An
<x-layouts.name>anonymous component tag - An
@extendsdirective - The layout attached to a Livewire component class
Files that have no layout still render against a built-in stylesheet. This also applies to Blade files that live outside a Laravel project entirely, so the tool degrades gracefully.
Installing Quick Blade
Installation is handled through Homebrew:
brew install --cask timgavin/tap/quick-blade
After installation, macOS will register the Quick Look extension automatically. Full installation instructions are available in the GitHub repository.
Key Takeaways
- Quick Blade works entirely offline — no dev server or database needed
- Supports layout resolution via
<x-layouts>,@extends, and Livewire component classes - Handles Flux and Livewire component styling out of the box
- Generates Finder thumbnails for Blade files in icon view
- Installed in a single Homebrew command
- Files outside a Laravel project still render with a built-in stylesheet
Where to Learn More
The source code is available on GitHub, and the project homepage with additional documentation is at quickblade.app.
Source: Laravel News — Preview Blade Templates in macOS Finder with Quick Blade
