09 - From Repeating HTML to Blade Component
16 - Alpine Inside Blade Components
17 - DRY: Blade Components
Tutorial
30 min read
Premium
Convert Bootstrap Theme into Laravel Project: Step-by-Step
One of the quickest ways to launch a website is to use a prebuilt HTML/CSS theme, free or paid. In this tutorial, I will show step-by-step how to take such Bootstrap-based theme for a real estate project, and turn it into a Laravel project: with layout, components and Eloquent data.
Tutorial
20 min read
Free
6 Laravel UI Kits and Component Libraries: 2025 Version
Laravel community has built a lot of Blade UI Kits and Component Libraries. In this article, we will review the most popular ones: how they work, and what is the visual result.
Tutorial
12 min read
Free
Laravel Blade: 5 UI Component Libraries
With Blade components and Tailwind, we can create great components in Laravel quickly. And there are also pre-built UI component libraries! This post will show four of them.
Video
15:33 mins
Free
Laravel Blade Components: Two Examples - Laravel Breeze/UI
This week I shared my thoughts on Twitter about Blade Components and that they are not that readable, in my opinion. After exchanging opinions with other Twitter users, I decided to practically test what's the difference of with/without components. So, two demos for you!
Video
6:28 mins
Free
Blade Components: Nested, Anonymous, and Laravel 8.62 New Syntax
In this video, I want to show you an example of "nested" Blade components for a table with headings/rows/cells, and also a new Laravel 8.62 feature to group such components in a sub-folder.
Video
6:22 mins
Free
"Built with Laravel" Code Review: Blade Components for Layout
In this video, we're talking about Blade components used for information and layout in the open-source project "Built with Laravel".
Quick Tip
Short attribute syntax for Blade Components
Package
816 stars
Last updated September 2025
protonemedia/laravel-form-components
Blade components to build forms with Tailwind CSS/Bootstrap
Code Example
tighten/laravelversions
tighten/laravelversions
Files in the example:
-
app/View/Components/LanguageSelector.php
-
resources/views/partials/modules/header.blade.php
Code Example
spatie/freek.dev
spatie/freek.dev
Files in the example:
-
app/View/Components/SeriesNextPostComponent.php
-
resources/views/components/series-next-post-component.blade.php
Code Example
spatie/spatie.be
spatie/spatie.be
Files in the example:
-
resources/views/components/label.blade.php
-
resources/views/front/profile/profile.blade.php
Video
5:04 mins
Free
Laravel: Active Links with Tailwind, Blade and Route Names
Five practical examples on how to detect if the link should be active.
Video
3:12 mins
Free
Laravel Blade Layout Components in Subfolders: Breeze Example
A quick refactoring of Laravel Breeze structure in a way how I would personally prefer.
Video
2:52 mins
Free
Laravel Blade Components Example: Asterisk in Translated Labels
A personal example of how I tried to added the "required" symbol which turned into a Blade component property.
Code Example
guillaumebriday/laravel-blog
guillaumebriday/laravel-blog
Files in the example:
-
app/View/Components/Alert.php
-
resources/views/shared/alerts.blade.php
-
resources/views/comments/_form.blade.php
Code Example
Gummibeer/gummibeer.de
Gummibeer/gummibeer.de
Files in the example:
-
app/View/Components/Avatar.php
-
resources/views/components/avatar.blade.php
-
resources/views/components/post/webmentions.blade.php
Code Example
christophrumpel/larastreamers
christophrumpel/larastreamers
Files in the example:
-
app/View/Components/AddStreamsToCalendar.php
-
resources/views/components/add-streams-to-calendar.blade.php
Code Example
Astrotomic/opendor.me
Astrotomic/opendor.me
Files in the example:
-
routes/web.php
-
resources/views/web/sponsors.blade.php
-
app/View/Components/Web/Sponsors.php
-
resources/views/components/web/sponsors.blade.php
-
app/View/Components/Web/GithubSponsors.php
-
resources/views/components/web/github-sponsors.blade.php
Code Example
Hi-Folks/gh-actions-yaml-generator
Hi-Folks/gh-actions-yaml-generator
Files in the example:
-
resources/views/components/card-template.blade.php
-
resources/views/livewire/configurator-form.blade.php
Code Example
jcergolj/laravellte
jcergolj/laravellte
Files in the example:
-
resources/views/components/profile/element.blade.php
-
resources/views/profile/users/index.blade.php
Code Example
tighten/onramp
tighten/onramp
Files in the example:
-
resources/views/components/form/section.blade.php
-
resources/views/components/input/text.blade.php
-
resources/views/components/button/primary.blade.php
-
resources/views/profile.blade.php