No files

admin1234
Jan 30, 2026 2
Live Preview

Live Editor

<div class="empty">
  <div class="icon">📂</div>
  <h2>No Files Found</h2>
  <p>
    You haven’t uploaded any files yet.
    Start by adding your first one.
  </p>
  <button>Add File</button>
</div>
body{
  margin:0;
  height:100vh;
  display:flex;
  justify-content:center;
  align-items:center;
  background:#020617;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  color:#fff;
}

.empty{
  width:300px;
  padding:36px;
  border-radius:24px;
  text-align:center;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(16px);
  box-shadow:
    0 30px 80px rgba(0,0,0,.5),
    inset 0 0 0 1px rgba(255,255,255,.18);
}

/* icon */
.icon{
  width:84px;
  height:84px;
  border-radius:50%;
  margin:0 auto 20px;
  display:grid;
  place-items:center;
  font-size:38px;
  background:linear-gradient(135deg,#8b5cf6,#3b82f6);
  box-shadow:0 0 40px rgba(139,92,246,.7);
}

/* text */
h2{
  margin:0 0 10px;
  font-size:22px;
}
p{
  margin:0 0 24px;
  font-size:14px;
  opacity:.75;
}

/* button */
button{
  padding:14px 26px;
  border-radius:999px;
  border:none;
  background:#fff;
  color:#000;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:.3s;
}
button:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(255,255,255,.4);
}
Categories

No files

Live Preview

Live Editor

Comments 0

Want to comment?

No comments yet
