html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Dashboard</title>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"
/>
</head>
<body>
<div id="body">
<div class="contain">
<div class="itm itm1"></div>
<div class="itm itm2">Kisuze Nahum</div>
<div class="itm itm3">
<b>M3</b><strong>Regular Employee </strong>
</div>
</div>
<div class="container ">
<div class="item">
<p class="head">Main Wallet</p>
<p class="mone">$0.00</p>
<button class="btn"><i class="fas fa-file-arrow-up"></i> Recharge</button>
</div>
<div class="item">
<p class="head">Commission Wallet</p>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
*{
Margin:0px;
scroll-behavior:smooth;
Font-family:Helvetica, Arial, sans-serif;;
}
#body{
Background:linear-gradient(180deg, #ffd21592, #ffd21592, white, white );
Padding:10px ;
Margin:0px;
}
P{
Margin:7px !important ;
}
.contain {
display:flex ;
Flex-direction:column ;
Justify-content:center ;
Align-items:center ;
Gap:5px;
}
.itm1 {
background-image: url('https://www.citypng.com/public/uploads/preview/download-black-male-user-profile-icon-png-701751695035033bwdeymrpov.png');
background-size: cover;
border:1px solid #555 ;
border-radius: 50%;
Enter to Rename, Shift+Enter to Preview
js
js
1
alert("Please upvote my Dashboard UI. Thanks")
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run