Advertisement
NubeColectiva

Logo de Netflix con Puro CSS

Jul 8th, 2025
77
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 1.58 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Logo de Netflix con Puro CSS</title>
  7.     <link rel="stylesheet" href="assets/css/estilos.css">
  8. </head>
  9. <body>
  10.    
  11.     <div class="netflix"></div>
  12.    
  13. </body>
  14. </html>
  15. <!DOCTYPE html>
  16. <html lang="es">
  17. <head>
  18.     <meta charset="UTF-8">
  19.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  20.     <title>Logo de Netflix con Puro CSS</title>
  21.  
  22.     <style>
  23.         body {
  24.             margin: 0;
  25.             height: 100vh;
  26.             display: flex;
  27.             justify-content: center;
  28.             align-items: center;
  29.             background: #000000;
  30.         }
  31.  
  32.         .logo-netflix {
  33.             width: 3rem;
  34.             height: 15rem;
  35.             border-left: 3rem solid #e50914;
  36.             border-right: 3rem solid #e50914;
  37.             position: relative;
  38.         }
  39.  
  40.         .logo-netflix::before,
  41.         .logo-netflix::after {
  42.             content: "";
  43.             position: absolute;
  44.         }
  45.  
  46.         .logo-netflix::before {
  47.             inset: 0;
  48.             background: #e50914;
  49.             transform: skewX(21.5deg);
  50.             box-shadow: 0 0 30px #000000;
  51.         }
  52.  
  53.         .logo-netflix::after {
  54.             width: 15rem;
  55.             height: 2rem;
  56.             background: #000000;
  57.             border-radius: 50%;
  58.             top: 98%;
  59.             left: -200%;
  60.         }
  61.     </style>    
  62.    
  63. </head>
  64. <body>
  65.    
  66.     <div class="logo-netflix"></div>
  67.    
  68. </body>
  69. </html>
Tags: html netflix CSS
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement