mk designing

Auto Compiler
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>3D Spinning Logo</title>
    <style>
/* Basic reset */
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f0f0f0;
}

/* Container for the logo */
.logo-container {
    perspective: 1000px; /* Gives a sense of depth */
}

/* The logo image */
.logo {
    width: 850px; /* Adjust as needed */
    height: auto;
    display: block;
    margin: 0 auto;
    animation: spin 5s infinite linear; /* Animation settings */
    transform-style: preserve-3d; /* Enable 3D transformations */
}

/* Keyframes for 3D spinning effect */
@keyframes spin {
    from {
        transform: rotateX(0) rotateY(0);
    }
    to {
        transform: rotateX(360deg) rotateY(360deg);
    }
}

</style>
</head>
<body>
    <div class="logo-container">
        <img src="https://mkdesigning.in/logo.png" alt="Logo" class="logo">
    </div>
</body>
</html>
OUT PUT