#webdevelopment
#Design #Development #Evolutions
2023 state of design systems and where we take them next · How far design systems have come and where they are heading https://ilo.im/11x65a
“Design systems continue to stick around and will likely stick around until there is a new buzzword for them.” — Ian Frost
_____
#DesignSystem #UiDesign #DigitalDesign #WebDesign #WebDevelopment #WebDev #AI #WebComponents #Frontend #HTML #CSS #JavaScript
#Business #Design #Development #Launches
sqlTranslate · Easily translate SQL commands into natural language and vice versa https://ilo.im/11vh0y
_____
#Tool #WebDesign #WebDevelopment #WebDev #Backend #Database #SQL #NaturalLanguage #Translator #DataAnalysis
“Heading off confusion: When do headings fail WCAG?” @davidofyork 2020. TPGi. (Found via @WebAxe.) https://www.tpgi.com/heading-off-confusion-when-do-headings-fail-wcag/
The Porkbun domain name registrar has an offer for a free .app or .dev domain for a year.
"Offer eligible for first-year standard registrations only on a .app or .dev domain. Limit one free domain per customer."
https://porkbun.com/event/freeappdevdomain?coupon=STACK23EMAIL&utm_medium=newsletter
Het voorlopige programma van de JoomlaDagen is bekend! Met presentaties op verschillende niveaus zit er altijd wat interessants voor jou bij.
#Joomla #JoomlaDagen #JD23NL #WebDevelopment
https://www.joomladagen.nl/programma
Still waiting for a date for my operations, so I am just "chilling" with some #Python, #Webdevelopment and #Typescript. Stille not ready to start the #100DaysOfCode challenge again, before the medical is done, and I feel better and are painfree
All about css update - Benjamin Kott - Web Camp Venlo 2023
#Development #Evolutions
Push notifications are now supported cross-browser · Finally, you can deliver timely and valuable notifications to your web users https://ilo.im/11z54f · by @tomayac
_____
#Browser #Chrome #Edge #Firefox #Safari #BrowserEngine #WebDevelopment #WebDev #Frontend #PWA #WebApp #PushNotifications
En nuestra instancia más reciente pudimos platicar con Abril Castro, quien nos platica de su experiencia profesional en el área.
¡No te olvides de compartirlo a quien más confianza le tengas!
https://mytypeof.dev/episode/s2-e14-mujeres-en-tech-abril-castro-talent-marketing
#MujeresEnTech #MesDeLAMujer
#podcast de #webdev en #español
#desarrolloWeb #webDevelopment
#recruitment #recruiters
#Development #Techniques
Fighting inter-component HTML bloat · Ways to deal with an unwanted byproduct in design systems https://ilo.im/11xzob · by @elise
_____
#DesignSystem #Webperformance #WebPerf #WebDevelopment #WebDev #Frontend #HTML #Markup #Accessibility #A11y
Hey guys. If you love #supabase and #mantine and #nextjs then I have something for you. A ready-to-go multi-tenant boilerplate, freshly built, future-safe, server components -> yes!
https://github.com/activenode/supabase-next-app-mantine
Contact me for consultancy if you need it or create an issue.
I didn't expect that day to come... iOS 16.4 will support #WebPush 🥳😱
This will be one big step into fully supporting #ProgressiveWebApps on all major platforms.
And lot more features all people in #WebDevelopment have waited for: https://webkit.org/blog/13966/webkit-features-in-safari-16-4/
#Development #Releases
WebKit features in Safari 16.4 · Apple’s most gigantic WebKit release yet, including PWA features! https://ilo.im/11yb28
_____
#Browser #Safari #WebKit #WebDevelopment #WebDev #Frontend #PWA #WebApp #WebPush #AppBadges #WebComponents #ShadowDOM #CSS #HTML #JavaScript #WebAssembly #WebAPI #DeveloperTooling #WebInspector #SafariWebExtensions #SafariContentBlockers #Image #Audio #Video
Stacked Social Sharing Buttons for Bootstrap https://tinyurl.com/9kmkjk79
#socialmedia #digitalmarketing #marketing #webdesign #webdev #websitedesign #webdevelopment #bootstrap
#Design #Development #Tools
Ruffle · Flash is back on the web – with a Rust-based Flash Player https://ilo.im/11x2bw
_____
#Ruffle #FlashEmulator #FlashPlayer #Rust #WebDesign #WebDevelopment #WebDev #OpenSource
The word "breakpoint" has probably lost its meaning in #WebDevelopment and #CSS. Nowadays, most people think breakpoints are the standard sizes of different devices (desktop, tablet, phone, etc.) But the reality is there is no standard for device widths.
Breakpoints really are the *points* in which your layout *breaks* and you have to adjust it. It's okay to not follow the media queries used by Bootstrap that you got used to if your layout breaks at widths different from the commonly-used ones.
Website Testing with Cypress.IO in less then 1 minute - Roland Golla - Web Camp Venlo 2023
As we are wrapping up three web design and build projects, taking a moment to reflect on process and tools. Always looking to become more efficient and checking out https://polypane.app. Wondering about time savings being able to see more than one rendering of a page at time. Could be helpful on dev side but also for our design team when reviewing work.
#webdevelopment #webdesign #devtools #tools #continuousimprovement
#Design #Development #Techniques
Affordances · How we can offer diverse ways of consuming regular content https://ilo.im/11weln
_____
#Concept #Affordance #UiDesign #DigitalDesign #ResponsiveDesign #WebDesign #WebDevelopment #WebDev #Frontend #HTML #JavaScript #TabSet #DisclosureMenu
#Development #Pitfalls
CSS-only widgets are inaccessible · The problem with most interactive widgets powered exclusively with CSS https://ilo.im/11x926
_____
#Widget #Usability #Accessibility #A11y #WebDesign #WebDevelopment #WebDev #Frontend #CSS
🖥️💻 Are you a web developer? The rise of website builders is changing the industry! Check out our latest blog post to learn how to adapt or exit to stay ahead of the game.
https://www.eliza-ng.me/post/webdesignai/
#webdevelopment #websitebuilders #techindustry
#Day11 : View Transitions API for MPA
Online demo :
https://teotimepacreau.github.io/View-Transitions-API-for-MPA-Day11-of-100DaysOfCode/
Source Code : https://github.com/teotimepacreau/View-Transitions-API-for-MPA-Day11-of-100DaysOfCode
Project goals :
- HTML meta tags on both pages to unlock transitions API without JS
- Transition composed by opacity, left and transform scale
#WebDev #Frontend #WebDesign #CodingChallenge #Javascript #LearnToCode #CodingDay #FrontendDevelopment #WebDevelopment #UIDesign #UITrend #CodingChallenge #LearnCode #LearningDaily #ViewTransitions
Make Use Of: How to Handle Data Fetching in React.js Using Tanstack Query https://www.makeuseof.com/react-data-fetching-using-tanstack-query/ #Tech #MakeUseOf #TechNews #IT via @morganeogerbc #WebDevelopment #Programming #JavaScript #React #API
Make Use Of: How to Use @next/font to Optimize Fonts in Next.js https://www.makeuseof.com/using-next-font-to-optimize-fonts-in-nextjs/ #Tech #MakeUseOf #TechNews #IT via @morganeogerbc #ProgrammingTools #WebDevelopment #Programming #React
The famous Sisyphus just released a brand new blazing fast JavaScript framework: Super Speed Simon! Rumor has it he rolled the code uphill until it finally ran in record time. #SuperSpeedSimon #JavaScript #WebDevelopment #JavascriptFramework #Sisyphus #miracle
#Development #Introductions
The search element · What to expect from HTML’s new grouping content element https://ilo.im/11wb00
“This is not the most important element that’s ever been added to the HTML specification. It is however a nice little accessibility win.” — Scott O'Hara
_____
#HtmlSpecification #SearchElement #WebDevelopment #WebDev #Frontend #HTML #ARIA #Accessibility #A11y
#Business #Development #Evolutions
Health benefits of browser diversity · “A pivot in strategy from Apple could open up so many doors to a healthier web” https://ilo.im/11vdd7
_____
#BrowserChoice #Browser #BrowserEngine #Chrome #Edge #Firefox #Safari #iOS #iPadOS #WebDevelopment #WebDev
Spin 1.0 aims to simplify WebAssembly microservices - Fermyon Technologies has published Spin 1.0, the first stable release the company’s op... - https://www.infoworld.com/article/3691890/spin-10-aims-to-simplify-webassembly-microservices.html#tk.rss_all #webdevelopment #cloudcomputing
NEW on Leanpub! Chrome Secrets: 99 Tech Optimizations That Boost Performance and Save Battery https://leanpub.com/chromesecrets99techoptimizationsthatboostperformanceandsavebattery by Unbug Lee #books #Chrome #webdevelopment #webdeveloper
Introduction to Nix package manager - Daniel Siepmann - Web Camp Venlo 2023
#Development #Proposals
Preventing too-short final lines of text blocks · A CSS proposal to get direct control over widows in text blocks https://ilo.im/11t33q · by @Richr
_____
#WebTypography #WebDevelopment #WebDev #Frontend #CSS #CSSWG #Widows
Friendly reminder!
The older Google Sign-In JavaScript platform library for Web is set to be DEPRECATED after March 31, 2023.
7 days left!
#Development #CheatSheets
When is :focus-visible visible? · How browsers determine when a focus outline is necessary https://ilo.im/11u4aj · by @ire
_____
#FocusVisible #WebDevelopment #WebDev #Frontend #CSS #WebForm #Keyboard #FocusOutline #UserAgent
#Webdevs what's the best way to make an in-site pop-up (one that doesn't create a new browser window, rather something within the browser)? Is there an html/css way or only javascript has the answer?
And by pop-up I mean something the user actively clicks on and a pop up comes up.
#100DaysOfCode : #HTML #CSS #VanillaJS
#Day10 : View Transitions API
Online demo :
https://teotimepacreau.github.io/View-Transitions-API-Day10-Of-100DaysOfCode/
Source Code : https://github.com/teotimepacreau/View-Transitions-API-Day10-Of-100DaysOfCode
Project goal :
- View Transitions API experimentation : understanding principle of implementation with VanillaJS .startViewTransition and DOMChanges activator
#WebDev #Frontend #WebDesign #CodingChallenge #Javascript #LearnToCode #CodingDay #FrontendDevelopment #WebDevelopment #UIDesign #UITrend #CodingChallenge #LearnCode #LearningDaily
Oracle Helidon taps virtual threads for ‘pure performance’ - Oracle’s Helidon, a set of Java libraries for developing cloud-native microservices, i... - https://www.infoworld.com/article/3691808/oracle-helidon-taps-virtual-threads-for-pure-performance.html#tk.rss_all #softwaredevelopment #webdevelopment #microservices #java
“Good freelance is 50% talent, 50% people skills.” — Sania Saleh
_____
#Business #UxDesign #UiDesign #WebDesign #WebDevelopment #WebDev #Freelance #Talent #Skills #Quote
Make Use Of: How to Add Meta Tags in Nuxt.js https://www.makeuseof.com/nuxt-js-meta-tags-how-to-add/ #Tech #MakeUseOf #TechNews #IT via @morganeogerbc #WebDevelopment #Programming #JavaScript #HTML
🎉Yesterday all 100 subscribers received the latest issue of my Full Stack #RubyOnRails Weekly Bookmarks newsletter 💯
Pop on over to see what all the fuss is about 🧐
#webdevelopment #coding
https://dcyoungdev.substack.com/p/full-stack-ruby-on-rails-weekly-bookmarks-693
I was pleasantly surprised and chuffed that my latest Solo Project on my #Scrimba journey only took two days to complete.
When I saw a 3 page website we had to write and style from scratch, I thought it would take weeks. But thanks to the reusability of my code, after doing the mobile #CSS, only a few tweaks were needed for the desktop design.
https://dodothedev-sp6-learningjournal.netlify.app/
#webDevelopment #ILoveCSS #CodeNewbie #100dev #100daysofcode #HTML #learningToCode
#Business #Development #Explorations
Web fingerprinting is worse than I thought · The current state of web fingerprinting and how to protect yourself https://ilo.im/11tnt6
“Fingerprinting in browsers works and severely undermines our privacy.”
_____
#Fingerprinting #UserIdentification #Tracking #WebDevelopment #WebDev #Browser #Chrome #Firefox #Tor #Privacy
How to work with EF Core migrations in ASP.NET Core - An object-database mapper for .NET Core, Entity Framework Core is the open-source, cro... - https://www.infoworld.com/article/3691114/how-to-work-with-ef-core-migrations-in-aspnet-core.html#tk.rss_all #softwaredevelopment #webdevelopment #microsoft.net #c#
Intro to Tauri: The Electron alternative - Tauri is a cross-platform framework that turns JavaScript or TypeScript code into a na... - https://www.infoworld.com/article/3690272/intro-to-tauri-the-electron-alternative.html#tk.rss_all #developmentlibrariesandframeworks #webdevelopment #javascript
#Development #Introductions
Open UI and the Popover API · It’s time to handle our basic popovers without the explicit need of JavaScript https://ilo.im/11tic2
_____
#W3C #OpenUI #PopoverAPI #Popover #Popup #Tooltip #WebDevelopment #WebDev #Frontend #HTML #CSS #Accessibility #A11y
New on Finley, I am: View Transitions Tech Demo
Damn I wish I could use a bigger font size in SourceTree
I did a little work on MyVideoGameList.com this morning. Now users should be able to export their lists as CSV, PDF or print them. 🎮🤓
#DataTables #PHP #Laravel #Javascript #webdevelopment #web #developer #development #code
#Development #Launches
MySQL for Developers · A video course to learn everything you need to know about MySQL https://ilo.im/11tvb8
_____
#WebDevelopment #WebDev #Backend #Database #SQL #MySQL #Free
I just now discovered that Codepen closed down their blog post functionality. I had some content written on that platform, so I guess it's time to migrate it to my core site.
One such article is a fun breakdown I wrote back in 2016 on how I built an SNES controller using CSS+HTML.
https://alexstandiford.com/articles/essays/a-breakdown-of-the-snes-controller-built-with-css-html
Make Use Of: 5 Node.js Packages to Build Your Next API https://www.makeuseof.com/nodejs-build-api-packages/ #Tech #MakeUseOf #TechNews #IT via @morganeogerbc #WebDevelopment #Programming #JavaScript
What’s new in #TypeScript 5.0?
One of the key highlights of this release is the incorporation of new decorators standards that enable users to customize classes and their members in a reusable manner.
Read on #InfoQ about other improvements: http://bit.ly/3K0wuaQ
The term "bug" has been used in engineering and technical fields for a long time to describe any issue or error that arises in a system. The first recorded use of the term "bug" in a technical sense dates back to the 19th century, when Thomas Edison used it to describe a problem he was having with one of his inventions.
However, in the context of computer programming, the term "bug" took on a more specific meaning. It was first used in this way by Grace Hopper, a computer scientist who worked on the Harvard Mark II computer during World War II. In 1947, the Mark II suffered a malfunction that was traced to a moth that had become trapped in one of its components. Hopper and her team removed the moth and affixed it to the computer's logbook with the note "first actual case of bug being found." This event is often cited as the origin of the term "debugging" to describe the process of finding and fixing errors in computer science.
Wrote a blog! After more than a year of not writing anything there 😄
Notes on using web workers in Angular
#webdevelopment #webdev #frontend #angular #webworkers #tech #blog
Ready to certify your #Linux, #DevOps, #BSD, #Security or #WebDevelopment skills?
Take any Linux Professional Institute (LPI) exam at a discounted price this April 14-15th at Grazer Linuxtage!
Register now: https://lpi.org/ZBp
Many thanks to Linux-Schmie.de for hosting the exam session.
#Business #Design #Development #Guidelines
Are you making these five mistakes when writing alt text? · The advice ‘describe what you see’ may seem simple, but it’s not https://ilo.im/11syvw
_____
#SocialMedia #SEO #WebDesign #WebDevelopment #WebDev #Website #Blog #Content #Image #AltText #Accessibility #A11y #ScreenReader
Dew Drop – March 21, 2023 (#3904)
Top links today:
- Azure Devs - .NET Day
- Building a Viva Connections card to display stock prices - Part 1
- GPTs are GPTs: An early look at the labor market impact potential of large language models
- go-sqlcmd
- Nuance & MS announce the first fully AI-automated ClinDoc app for Healthcare
- File & folder dialogs in .NET MAUI with Community Toolkit
https://www.alvinashcraft.com/2023/03/21/dew-drop-march-21-2023-3904/
#dotnet #webdevelopment #cloud #mobiledev #csharp #windowsdev #visualstudio #dewdrop
Accessibility & mono repository - Patrick Broens - Web Camp Venlo 2023
#Development #Outlooks
The end of front-end development · Things are going to change, but not in the scary way people are saying https://ilo.im/11t8v2
_____
#Job #AI #GPT4 #ChatGPT #ChatBot #WebDevelopment #WebDev #Code #Frontend #HTML #CSS #JavaScript #Skills #Productivity
Well if I were brain-damaged enough to work in #WebDevelopment using #JavaScript, this site would be invaluable to me!
Just realized that I didn't add back the Mastodon verification link on my website when I updated it 😅
(If your website has a link to your #Mastodon profile with the attribute rel="me", it will have a green checkmark on your profile!)
#Development #Tools
Make Bookmarklets · A web tool that helps you build tiny JavaScript apps stored in a bookmark url https://ilo.im/11rs61
#Technica11yDE: Wer den Livestream @tollwerk / Tenon zum Vortrag von Chris @codepo8 heute verpasst hat, bitte hier entlang. Chris' startet ab Minute 33'00'' (davor Ankommen, Begrüßen, Regeln usw.). Schwerpunkt sind die Entwickler-Tools im Browser und in #VSCode.
https://www.youtube.com/live/4bLD7Pdn_xI?feature=share&t=1980
Danke für Organisation & Moderation Joschi @jkphl 😊
#Barrierefrei #accessibility
#NachhaltigeDigitalisierung #WebDevelopment #WebEntwicklung #AccessibleByDesign
What’s new in TypeScript 5.0 - TypeScript 5.0, an update to Microsoft’s strongly typed JavaScript variant, is now ava... - https://www.infoworld.com/article/3686509/whats-new-in-typescript-50.html#tk.rss_all #developmentlibrariesandframeworks #softwaredevelopment #webdevelopment #typescript #javascript
“If your site has a favicon when you launch, you launched too late.” — Marc Köhlbrugge
_____
#Design #Development
#ProductLaunch #ProductDesign #UiDesign #WebDesign #WebDevelopment #WebDev #Frontend #Website #Favicon #Quotes
#Design #Development #Approaches
The importance of adding accessibility design reviews to the design process · What digital design and blueberry muffins have in common https://ilo.im/11q01k
_____
#DesignReview #UiDesign #WebDesign #WebDevelopment #WebDev #InclusiveDesign #DesignProcess #Workflow #Accessibility #A11y
My review of Jimmy Engstrom's new second edition of Web Development with Blazor is now live on Amazon. In my opinion, it's an "Excellent update..."
#dotnet #ref #reviews #books #blazor #webdevelopment #aspnetcore #webassembly #wasm #webdev
Over 20 years of bringing web applications to life. Passionate about Accessibility, Design Systems, & User Experience.
Novice but enthusiastic content creator, learning how to share more of my story building https://beinclusive.app
Featured Hashtags:
#WebDevelopment (#WebDev)
#Accessibility (#a11y)
#UIDevelopment
#SaaS
#DesignSystems
Make Use Of: How to Build a Music Player Using Python https://www.makeuseof.com/build-music-player-using-python/ #Tech #MakeUseOf #TechNews #IT via @morganeogerbc #GameDevelopment #WebDevelopment #Programming #Python
I just launched a utility to help format Tailwind CSS classes for readability while minimizing whitespace rendered in the DOM. This utility has support for inline C-style comments within the class lists to help document complex styles. View this project on GitHub and install via NPM. I hope someone finds this helpful. Feel free to offer suggestions for improvement.
https://github.com/goldenpathtechnologies/tagged-classnames
https://www.npmjs.com/package/tagged-classnames
#TailwindCSS #WebDevelopment #WebDev #TypeScript #ClassNames #GitHub #NPM #JavaScript
Did you know that the first website ever created is still live today? It was created by Tim Berners-Lee in 1991 and was dedicated to information about the World Wide Web. 🌐💻
http://info.cern.ch/hypertext/WWW/TheProject.html
#webdevelopment #funfact #webhistory #timbernerslee #worldwideweb #internet #webdesign #webtech #webdev #programming #coding #html #css #javascript #frontend #backend #webdeveloper #webprogramming #webapp #tech
You know I typically only take the piss out of @jaffathecake but I honestly really respect the work he and his team are doing on #viewTransitions
I don't even know if I care about the feature, but his dedication to the #webStandards process and immaculate communication of it is fucking admirable! #careerGoals
Do slippymaps next Jake!
>SPA view transitions land in Chrome 111 https://developer.chrome.com/blog/spa-view-transitions-land/
#Development #Guides
Why you need to know your site’s performance plateau · What it is, how to measure it, and what to do with your new insights https://ilo.im/11nu2z
_____
#WebDevelopment #WebDev #WebPerformance #WebPerf #Measurement #Metric #WebVitals #LCP #RUM
It's a bad day for the bugs: Syntax Error #2 just went out!
This month's issue talks about printing as a debugging tool and about Elm's error messages and debugging your Elm code.
#debugging #newsletter #webdev #webdevelopment #elmlang #software #developer #development
https://www.syntaxerror.tech/syntax-error-2-print-it-like-a-boss/
#Design #Development #Demos
GPT-4 demo turns a crude sketch into a functional website · What cutting-edge artificial intelligence is capable of in web design https://ilo.im/11pr2m · by Chris Coyier
_____
#Automation #AI #GPT4 #UiDesign #WebDesign #WebDevelopment #WebDev #Website #Wireframe #Sketch #Frontend #HTML #CSS #JavaScript
Following up on this, do you considered dark mode an important feature of websites and mobile apps?
#WebDev #WebDevelopment #WebDesign #DarkMode #LightMode #poll
Does your personal site have a dark mode?
#WebDev #WebDevelopment #WebDesign #DarkMode #LightMode #poll
Finally added a working prototype of a dark mode to my personal site. I feel like this is a must nowadays, and to me it always stands out when a site or a mobile app doesn't support it.
How's everyone else doing with their website? (Poll in the next message.)
Enjoying a day off, swinging by deque axe-con 2023 to catch a great talk by Aaron Gustafson on #accessibility with AI Research & Ethics, D&I, Product Design, Data Science & Design Systems.
#Tech has been (rightfully) getting a rough ride lately, but a reminder here of all the good stuff it can achieve.
New Cartoon: Video Problems
https://comicss.art/?id=79
Source code and live demo: https://comicss.art/comics/79/video-problems.html
#Development #Techniques
6 CSS snippets every front-end developer should know in 2023 · Toolbelt worthy, powerful, and stable CSS you can use today https://ilo.im/11pa5a
_____
#WebDevelopment #WebDev #Frontend #CSS #ContainerQueries #ScrollSnap #CssGrid #CascadeLayers #LogicalProperties
What most clients ask for, what they really need.
#WebDevelopment #WebDesign
Dew Drop – March 14, 2023 (#3899)
Today's top links:
- Mica or Acrylic with WinUI & .NET MAUI
- Highlights from Git 2.40
- Windows Terminal version 1.17 highlights
- PSReadLine 2.3.0-beta0 release
- Bring the ChatGPT model into our applications
https://www.alvinashcraft.com/2023/03/14/dew-drop-march-14-2023-3899/
#dotnet #webdevelopment #cloud #windowsdev #csharp #mobiledev #devops #ai #database #dewdrop
A must read for web professionals. "The Great Gaslighting of the JavaScript Era" https://www.spicyweb.dev/the-great-gaslighting-of-the-js-age/ #webdev #webdevelopment #javascript
Why did a duck cross the street? To help you fix a bug.
My duck jokes may be bad but the newsletter is great.
Syntax Error's second issue hits inboxes and RSS readers this Friday. Sign up now at https://www.syntaxerror.tech/ so you don't miss it!
This one is for those out there trying to land their first role as a frontend/full-stack developer.
Transform Your Portfolio Website with These Expert Tips, https://dev.to/nickytonline/transform-your-portfolio-website-with-these-expert-tips-334e #frontend** **#webdevelopment
@pichan I created my website with absolutely zero knowledge before I began to learn all about #webdevelopment and #SEO. My experience is still vert limited but I'm happy with the result. I mainly blog about my journey into art, particularly #abstractart. Promoting blogs is another new subject to me. I would welcome suggestions.
And the most random assortment of buttons to summon Satan https://codepen.io/thebabydino/pen/eYYyqZR
Fun fact: first made this for a conference talk. Upon arriving there, discovered the venue was a church. One of the paintings there crashed with a loud noise during my talk.
https://twitter.com/anatudor/status/1197923211347931138
Requires support for registering custom properties via @ property.
#CSS #JS #CodePen #webDev #button #buttons #control #controls #coding #webDevelopment #mask #svg #satan
Plus:
✨ an old download button https://codepen.io/thebabydino/pen/xZxyPb
✨ an animated version https://codepen.io/thebabydino/pen/VwzpMxV (Chromium only) of the candy ghost buttons I wrote about a few years back on CSS-Tricks: https://css-tricks.com/css-ing-candy-ghost-buttons/
#CSS #JS #CodePen #webDev #button #buttons #control #controls #coding #webDevelopment #mask #pastel
Some XOR effect close buttons for some random quotes https://codepen.io/thebabydino/pen/VwmQQwJ
The basic idea behind is something I recorded myself coding from scratch https://codepen.io/thebabydino/pen/bGBLXEy
The concept behind the XOR is something I explaine in this @css article https://css-tricks.com/taming-blend-modes-difference-and-exclusion/
#CSS #JS #blending #CodePen #webDev #button #buttons #control #controls #coding #webDevelopment
✨ https://codepen.io/thebabydino/pen/NWWzKzR
✨ https://codepen.io/thebabydino/pen/QWLJpOb
✨ https://codepen.io/thebabydino/pen/OwOgBv
✨ https://codepen.io/thebabydino/pen/bGrLprB
https://twitter.com/anatudor/status/1624419401184296961
#CodePen #webDev #button #buttons #control #controls #coding #webDevelopment #neumorphism
Some more glassy pure #CSS buttons with a single button element:
✨ https://codepen.io/thebabydino/pen/ajLVGN
✨ https://codepen.io/thebabydino/pen/GBMEqv
✨ https://codepen.io/thebabydino/pen/JBrNEx
✨ https://codepen.io/thebabydino/pen/jBbXPP
#CodePen #webDev #button #buttons #control #controls #coding #webDevelopment #glassy #pastel #neon
Responsive buttons with #CSS vars
https://codepen.io/thebabydino/pen/qyVyKb
Glass buttons
#1 https://codepen.io/thebabydino/pen/QBOKPy
#2 https://codepen.io/thebabydino/pen/jpaZBy
Flat buttons
https://codepen.io/thebabydino/pen/porLEXy
#CodePen #webDev #button #buttons #control #controls #coding #webDevelopment
Would have loved to do something for this week's #CodePenChallenge, but the past weeks have had too many tech (both hardware & software) and non-tech problems eating out of my time, so all I have is a bunch of older button demos I made on #CodePen: