Spinner Generator
Preview
Generated HTML
1<div class="spinner-container">
2 <div class="spinner"></div>
3</div>
Generated CSS
1
2.spinner-container {
3 display: inline-flex;
4 flex-direction: column;
5 align-items: center;
6 justify-content: center;
7}
8
9.spinner-text {
10 margin: 10px 0 0 0;
11 font-size: 14px;
12 color: #000000;
13}
14
15.spinner {
16 width: 50px;
17 height: 50px;
18 border: 5px solid #f3f3f3;
19 border-top: 5px solid #3498db;
20 border-radius: 50%;
21 animation: spin 1s linear infinite;
22}
23
24@keyframes spin {
25 0% { transform: rotate(0deg); }
26 100% { transform: rotate(360deg); }
27}
28