DEV Community

loading...
Cover image for Create responsive web components quickly with TailBlocks

Create responsive web components quickly with TailBlocks

Souvik Paul
Just an ordinary computer science noob 🖱️
Updated on ・1 min read

Recently I got to know about Tailwind CSS. It's a highly customizable low-level CSS framework that can help you to create beautiful websites quickly and easily, according to them.


They have a ready to use block building tool named TailBlocks and this article is all about it.

How to use

To use TailBlocks, first you have to add the Tailwind CSS file to your Html code. Or you can add their CDN build.

Step 1

Add this code to your html.
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
Or, go to this page for all links: https://tailwindcss.com/docs/installation/

Step 2

Go to https://mertjf.github.io/tailblocks/ and choose a block.

Step 3

Click on the View Code button and copy the code of that block.


Then, paste the code inside body tag.


To add another block, do the same procedure again.


Here, I made a website for the new animation short film that I's working on: https://ravikstudio.blogspot.com/

Disclaimer:

This technique can never replace the traditional web development. But, if you know html, css very well, you can use Tailblocks to deploy your/your client's sites quickly and easily.

Discussion (0)