Tailwind CSS Generator

About

Tailwind CSS Generator is a NO-CODE SAAS application
that I am building. This application is to ensure prototyping
of tailwind components :)

Stack Used

The stack is simple

• Svelte
• Vite
• Github Pages

Why use Svelte?

1. Wanted to understand a different way to develop an application,
   so that I can improve my programming skills.
2. Svelte is also a fast framework, as it is lightweight.

Documentation

How to use the application?

Keyboard Shortcuts

• Color press c
• Border press b
• Effects press e
• Filter press f
• Outline press o
• Padding press p
• Ring press r
• Close a Panel press x

Listed the features below:

1. Border
• Color
• Width
• Radius
• Style
• The code will only show b-l, b-r, b-t, b-b => WIP to so that other padding properties will be shown


2. Filters
• Blur
• Brightness


3. Effects
• Box Shadow
• Opacity
• Mix Blend


4. Padding
• All four sides
• The code will only show p-l, p-r, p-t, p-b => WIP to so that other padding properties will be shown


5. Outline
• Style
• Width
• Offset


6. Ring
• Width
• Offset

** Note that all properties are the same as the properties from the offical Tailwind DOCS **