Code Snippets CSS

Short texts CSS 🧑‍💻 Code snippets CSS ✍️ Reading lists CSS 👀

Lost in Space 404 Error Page with SVG & CSS Animation

404 LOST IN SPACE App-Name? Hmm, looks like that page doesn’t exist. Go Home Lost in Space 404 Error Page with SVG & CSS Animation —————————————————– A [Pen](https://codepen.io/hellochad/pen/weMpgE) by [Chad](https://codepen.io/hellochad) on [CodePen](https://codepen.io). [License](https://codepen.io/hellochad/pen/weMpgE/license). var particles = { “particles”: { “number”: { “value”: 160, “density”: { “enable”: true, “value_area”: 800 } }, “color”: { “value”: “#ffffff” […]

RwZoZvE

Sedans Choose a sedan for its affordability and excellent fuel economy. Ideal for cruising in the city or on your next road trip. Click here Sedans Choose a sedan for its affordability and excellent fuel economy. Ideal for cruising in the city or on your next road trip. Click here Sedans Choose a sedan for […]

CSS Gradient Animation

.css-selector {     background: linear-gradient(338deg, #246655, #03e5ab, #dbe503, #03cfe5);     background-size: 800% 800%;     -webkit-animation: AnimationName 30s ease infinite;     -moz-animation: AnimationName 30s ease infinite;     -o-animation: AnimationName 30s ease infinite;     animation: AnimationName 30s ease infinite; } @-webkit-keyframes AnimationName {     0%{background-position:24% 0%}     50%{background-position:77% 100%}     100%{background-position:24% 0%} } @-moz-keyframes AnimationName {     0%{background-position:24% 0%}     50%{background-position:77% 100%}     100%{background-position:24% 0%} } @-o-keyframes AnimationName { […]

Fluid-grid #2

Fluid-grid #2 ————- A [Pen](https://codepen.io/renzoscriber/pen/mdMOBxy) by [Sofia Scriber](https://codepen.io/renzoscriber) on [CodePen](https://codepen.io). [License](https://codepen.io/renzoscriber/pen/mdMOBxy/license). ♌ Welcome Back 🌌 Renzo go stream already! Hello World Renzo stop being an idiot Let It Go Welcome Back Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, […]

LYjbyRX

LYjbyRX ——- A [Pen](https://codepen.io/emma-bubbles/pen/LYjbyRX) by [Emma](https://codepen.io/emma-bubbles) on [CodePen](https://codepen.io). [License](https://codepen.io/emma-bubbles/pen/LYjbyRX/license). .emmabox1 { width: 320px; background: var(–navibg); object-fit: cover; object-position: center; margin: auto; padding: 60px 30px 5px 30px; border-left: 25px solid transparent; border-right: 25px solid transparent; border-top: 30px solid var(–navibg); border-image: linear-gradient(to bottom , rgba(var(–accent-bg), 1) 20%, var(–navibg) 70%, var(–navibg) 40%); border-image-slice: 1; border-radius: 15px; } .emmasicon […]