Tailwind Tools:
Button Generator
Table Tool
Cards
Alerts
Progress
More
▼
Pagination
Dropdown
Badges
Breadcrumbs
Text Maker
Link Maker
☰
Button Generator
Table Tool
Cards
Alerts
Progress
More
▼
Pagination
Dropdown
Badges
Breadcrumbs
Text Maker
Link Maker
Tailwind CSS Link Maker Tool
Customize Your Link
Link Text
Link URL
Link Text Size
Extra Small
Small
Normal
Large
Extra Large
Font Family
Sans
Serif
Monospace
Link Color
Black
Blue
Red
Green
Font Weight
Normal
Bold
Light
Medium
Text Margin
Text Padding
Text Alignment
Left
Center
Right
Text Decoration
No Underline
Underline
Line Through
Open Link In
Same Tab
New Tab
Preview Link
Link Preview
Preview Link
Generated Code
Copy Code
How to use Link Maker Tool
Enter the Link Text and Link URL.
Specify the Text size of the link, Font Family, Link Color, and Font Weight (Bold, Normal, Light, and Medium).
Set the Margin and Padding by using Tailwind CSS classes. For example, p-2, p-4 for padding and m-2, m-4 for margin.
Specify the Alignment of link text along with Decoration (Underline, No Underline or Line Through).
You may also set the target for opening the link i.e. Open in the same window or in new Tab.
Once all options are set, press the “Preview Link” button. It shows the generated link and the “Generated Code” area is also updated with new code.
Grab the code by pressing the “Copy Code” button.
Related Links
Tailwind Button Maker
Tailwind Badge Maker
Tailwind Table Tool