Preview:
@import "antd/dist/antd.css";

.ant-spin-nested-loading {
  width: 100%;
  height: 100vh;
  background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
}

.ant-alert-info {
  background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
  border: none;
}
.ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
  top: 100%;
}
.ant-spin-text {
  top: 100% !important;
  color: rgb(11, 11, 11);
  font-weight: bold;
  font-size: 110%;
}
.ant-spin-dot-item {
  background-color: rgb(11, 11, 11);
}


import { Alert, Spin } from 'antd';
import React from 'react';
const App = () => (
  <Spin tip="Loading...">
    <Alert
    
    />
  </Spin>
);
export default App;
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter