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