RT Chris Coyier
I wouldn't think most responsive interfaces just straight up *scale* themselves to the viewport. But sometimes!
This postcss-px-to-viewport PostCSS plugin is neat. You can just work in `px` at a fixed viewport, and automatically get the viewport units.
https://codepen.io/chriscoyier/pen/VwbLNPW?editors=0100
RT AdirCode
400 Followers! 🎉
Thank you to every one of you, I really appreciate you 🙏
I made this CSS Animation to celebrate this event:
https://codepen.io/Adir-SL/pen/mdmVmBQ
RT Ajay Menon
Created something called a Morse Drummer for the #CodePenChallenge
Takes in text. Converts it to morse code. And adds a beat based on the dots & dashes.
Handy mostly for accidental beatboxing raves during WW2 comms.
CodePen.IO: The July #CodePenChallenge starts now 🎆
This month is all about Patterns! We'll work with patterns in code, patterns in design, and patterns in nature.
This week, we kick it off with a simple pattern: dots & dashes
Thanks @EducativeInc for sponsoring!
https://codepen.io/challenges/2021/july/1
RT Amit Sheen
If you're going to do something for this week's #CodePenChallenge, I've made some Dots and Dashes patterns with CSS (using background-image), and you're welcome to use them.
All patterns on @CodePen:
https://codepen.io/amit_sheen/pen/dyWGVgj
The July #CodePenChallenge starts now 🎆
This month is all about Patterns! We'll work with patterns in code, patterns in design, and patterns in nature.
This week, we kick it off with a simple pattern: dots & dashes
Thanks @EducativeInc for sponsoring!
https://codepen.io/challenges/2021/july/1
RT Adam Kuhn
realize browser support is kinda *not great* here but I really love the option to animate SVG as base64 background-image
https://codepen.io/cobra_winfrey/pen/YzVXomN
https://twitter.com/cobra_winfrey/status/1411028983756505094
RT carl schooff
Needed a simple checkbox for a demo I'm working on. Was thrilled to find this iOS Pure #CSS checkbox from @brynjulfs1 Worked flawlessly out of the box and was easy to adapt to my needs.
@CodePen demo here:
#100daysOfCode #frontend #webdevelopement
https://codepen.io/havardob/pen/RajdNR?editors=1010
RT Amit Sheen
Flying #CSS platform
Full code @CodePen:
https://codepen.io/amit_sheen/pen/mdmJNYz
RT ilithya
My vampire smileys, psychedelic eye and shaders were touring Japan this summer! 🙂
Last week in Tokyo, some of my digital art was exhibited across more than a dozen screens inside Miyashita park on/off during the whole week ✨🥳
https://twitter.com/ilithya_rocks/status/1410718935146709003
RT Jhey 🐻🛠 (Exploring Opportunities ✨)
Blockquote concept using a little perspective and CSS custom properties 😎
Been enjoying the creative freedom to come up with things @temporalio 🤓
Adding a dash of whimsy to materials 🎉
⚒️ @reactjs && @tailwindcss (Site is NextJS)
👉
http://codepen.io/jh3y/pen/xxdGMya
RT Scott Kellum
Updated this @CodePen with CSS logic gates so that you can toggle between input/output!
Scott Kellum: CSS logic gates using blend modes and filters.
Because CSS is a programming language ✨
Inspired by the work of @RockStarwind
https://codepen.io/scottkellum/pen/yLbNgqG
RT Adam Argyle
Text on a path? Try SVG!
1️⃣ create a
<path id="whatevs">
2️⃣ add a
<text>
3️⃣ tie it together with a
<textpath href="#whatevs">
here's a @CodePen where I turned the phrase "task complete" into a checkmark ✅ with a few lines of SVG
https://codepen.io/argyleink/pen/ZEKYwea
</textpath>
</text>
</path> https://twitter.com/argyleink/status/1410589757084667912
RT Jon Kantner
Bouncy Preloaders
https://codepen.io/jkantner/pen/VwbLajq
RT Ana Tudor 🐯
In the 🌈🕑🌊 - see me code this in 8 minutes with Houdini magic 🎩✨🐇
Live on @CodePen
Inspiration
https://www.patreon.com/posts/video-in-53125409
https://codepen.io/thebabydino/pen/gOmVZNw
https://giphy.com/gifs/motiondesign-365gifs-motionlovers-MCj3a9oGpxhJiEQ406
RT Bence
I produced a new SVG pattern/texture each week on @CodePen this year. Here's a little summary on it 😁
#PetitePatterns
https://www.linkedin.com/pulse/26-images-you-wont-believe-were-created-only-svg-bence-szab%25C3%25B3
RT Ayush 👨💻
Timeline animations I made using anime.js Glowing 🌟
Codepen :
#CSS #javascript #100DaysOfCode #codepen #CodeNewbie #webdeveloper
https://codepen.io/ayush6968/pen/vYmEYBX
RT Amit Sheen
Click to open...
(Pure #CSS, but a lot of it 🙄)
Full code @CodePen:
https://codepen.io/amit_sheen/pen/YzVPrGb
RT Takane Ichinose 市瀬峻峰
#CodePenChallenge Menu Layout: Brutalist and Skewmorphism
This is a design of a menu inspired by brutalist and skewmorphic design.
#html #css #showdev #webdesign #ui
https://codepen.io/takaneichinose/pen/MWmYQZG
RT CurleyWebDev
Pure CSS Animation... The letters are provided by the "each" rule...
@CodePen
:
#CSS #HTML #webdevelopment #FrontEndDevelopment
https://codepen.io/curley/pen/GRWJMOG
RT Ana Tudor 🐯
Deep inside a ⬡🐚 - see me pure CSS something... and probably learn something new!
Live on @CodePen:
Original gif by @beesandbombs
dave: :)
Build, test, and discover front-end code 👩🏽💻