.container { display: flex; align-items: center; justify-content: center; height: 100vh; } .dots-holder { display: flex; gap: 0.2rem; } .dot { animation: 1s flash 0.5s infinite; width: calc(var(--vscode-editor-font-size) / 2) !important; height: calc(var(--vscode-editor-font-size) / 2) !important; border-radius: 100%; background-color: #b200f8; opacity: 0.25; } .dot:nth-child(2) { animation-delay: 0.6s; background-color: #ff5543; } .dot:nth-child(3) { animation-delay: 0.7s; background-color: #00cbec; } @keyframes flash { from { opacity: 1; } 50% { opacity: 1; } to { opacity: 0.25; } }