સુંદર CSS લોડર્સ બનાવો

Generate custom CSS loading animations in seconds with our intuitive drag-and-drop interface. No coding required!

Customize Your Loader

લોડર પ્રકાર

Color

Size 40px

Speed 1s

અદ્યતન વિકલ્પો

Preview

.loader { border: 4px solid #f3f3f3; border-radius: 50%; border-top: 4px solid #165DFF; width: 40px; height: 40px; animation: spin 1s linear infinite; }  @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

કેવી રીતે ઉપયોગ કરવો

ડાબી બાજુના નિયંત્રણોની મદદથી તમારા લોડરને વૈવિધ્યપૂર્ણ બનાવો
"CSS પેદા કરો" બટન પર ક્લિક કરો
પેદા થયેલ HTML અને CSS કોડની નકલ કરો
તેને તમારા પ્રોજેક્ટમાં ચોંટાડો

લોકપ્રિય લોડર ઉદાહરણો

પલ્સ લોડર

3 Dots અમલમાં મૂકવામાં સરળ

સ્પિનર લોડર

Classic 100% CSS

Dual Ring

દ્વિવર્તુળ આધુનિક શૈલી

બાઉન્સ લોડર

ઉછળતા બિંદુઓ સરળ એનિમેશન

રીંગ લોડર

બિંદુ સાથે રીંગ કરો અનન્ય રચના

સ્કેલ લોડર

ખેંચવા માટેના બિંદુઓ Lightweight

CSS લોડરનો ઉપયોગ કેવી રીતે કરવો

મૂળભૂત અમલીકરણ

આ સાધન દ્વારા જનરેટ થયેલ સીએસએસ લોડરનો ઉપયોગ સીધો છે. ફક્ત તમારા પ્રોજેક્ટમાં જનરેટેડ એચટીએમએલ અને સીએસએસ કોડની નકલ કરો.

સ્ટેપ ૧ઃ CSS ઉમેરો

Add the generated CSS code to your stylesheet or in a