🚚 New cem release! The standards-based #WebComponent multitool just released v0.9.0 including support for #JavaScript class mixins, numerous bug fixes, and an overhauled and much more readable docs site.

Give it a try today in your web components project and let me know what you think!

bennypowers.dev/cem/

github.com/bennypowers/cem/releases/tag/v0.9.0

#dans_mon_flux :

My HTML Web Component boilerplate for 2026 | Go Make Things
🔗 https://gomakethings.com/my-html-web-component-boilerplate-for-2026/

👉 https://shaarli.lerebooteux.fr

#webcomponent #boilerplate #template

#Development #Fun
Hallucinations using web components · How to make your self-written posts look machine‑written https://ilo.im/168oqv

_____
#Simulation #AI #Hallucinations #Content #Blog #WebComponent #WebDev #Frontend #HTML #JavaScript

This weekend, I was inspired by the once-common, now-absent "Turbo" button of computers past. So I implemented a #webComponent that reproduces the experience of pressing one and watching the little LED turn off and on.

Wanna see?

🔗 https://beige-buttons.danq.dev

<color‑input> — современный веб‑компонент Адама Аргайла для выбора цвета, который поддерживает широкий цветовой охват (sRGB, Display P3, Rec2020) и конвертирует между sRGB, HSL, HWB, LAB, LCH, OKLCH и OKLAB. Построенный на Color.js, Preact Signals и Shadow DOM, он настраивается через CSS parts и поставляется в виде tree‑shakeable ES-модулей. Кастомный элемент автоматически регистрируется при импорте и работает в браузерах с Popover API. #webcomponent #color

https://color-input.netlify.app/

Does anyone have a favorite #WebComponent that validates at least one of a group of checkbox inputs is checked?

#WebComponents #HTML #CustomElements

#webComponent thought for the day: I'm thinking of changing my approach. I always prefer HTML first. However, if JS failed, for some components, I didn't want to show anything as they wouldn't be functional without JS, so I added elements dynamically. However, that can be resolved by setting display:none in CSS then showing them elements with JS once loaded. Maybe this would be better 🤔

Weekend project done: naked-table-stripe-sort #webComponent published: https://codeberg.org/patrickgrey/naked-web-components/src/branch/main/naked-table-stripe-sorter
Demo here: https://patrickgrey.co.uk/projects/naked-web-components/

Can't avoid garage tidy any longer...

A while ago, I had a need for a vertical scrolling assistant that skipped to styled articles, so I built one and put it out in public.

Accessible, configurable vanilla #WebComponent

https://www.npmjs.com/package/@localnerve/jump-scroll

Page includes a link to a live demo.

#webdev #webdevelopment #webcomponents

It's Twofer Friday! 🥳

1) @11ty website redesign: https://www.patrickgrey.co.uk/ 💅

2) I'm launching v1 of my small #webComponent library: Naked Web Components! They are focussed on function with minimal styling.

Read all about it here: https://www.patrickgrey.co.uk/projects/naked-web-components/ and find the code here: https://codeberg.org/patrickgrey/naked-web-components.

I never expected to create a component called <naked-sticky-overflow>... 😬

I'd love to know if they are useful for anyone 🥰

I wished there was a native todo app web component that you could drop into your web application under construction and test data update and mutation flows.

So I made one.

https://github.com/localnerve/editable-object

#webdev #webdevelopment #WebComponent #HtmlWebComponent #Frontend #HTML #CSS #JavaScript

#Development #Launches
Grid-aware status bar · A web component for energy-smart websites https://ilo.im/166dmv

_____
#Electricity #Sustainability #Website #Design #WebDesign #WebComponent #OpenSource #WebDev #Frontend

Trying out moving Joist over to Codeberg. If you are over there give it a star and a watch!

https://codeberg.org/deebloo/joist

#webdev #webcomponent #javascript

Why do all #webcomponent examples use innerHtml = when innerHtml is inherently insecure?

#Development #Launches
Split Flap · A fun text animation web component for your site https://ilo.im/165pb9

_____
#Text #Display #Animation #WebComponent #Design #WebDesign #WebDev #Frontend #HTML #JavaScript

Because of the generic nature of the terms, I'm having trouble searching for something that should have a page in the Nuxt docs somewhere:

I want to use an existing Web Component (developed by a third party) in a Nuxt app. It is having trouble with the SSR and I can't figure out how to work around it so that the web component is named in the template area but is only initialized in the browser.

Or, alternately, what I can tell the developer to do differently to make it work. It says it can't find "HTMLElement".

#nuxt #webcomponent

Wanted to try out this <syntax-highlight> #WebComponent for myself https://andreruffert.github.io/syntax-highlight-element/

The result is super clean and a fair chunk smaller than what's typically used. Even works with contenteditable!
https://codepen.io/daviddarnes/pen/bNVVVxQ?editors=1000

You know what I love? clicking on the "copy" button on #github and having it do literally nothing

see, this button used to be a #webcomponent, and it would just work in all cases, but that was unacceptable because you can't hire people to write web components


So now it's a fabulous, very functional, very just #javascript #react component, and I'm happy because even though it doesn't work, it looks great on a State Of survey.

Wouter Lemaire shows how to use any #webcomponent in #ui5 apps at #ui5con 2025

Are Web Components & Cybersecurity A Better Combo?

I'm not trying to dunk on popular #UI #frameworks – I'm sure they're totally fine for #cybersecurity stuff, probably get loads of reviews and #audits.

But from my angle: Web Components are *native* to the #browser. Doesn't that just inherently reduce the risk of **#SupplyChainAttacks** (you know, like a rogue `npm install` on a bad network) for your #AppSecurity?

Or am I overthinking it, and the #framework choice is less important than the #browser, #OS, or #device running it? What are your thoughts, #DevCommunity?

---

Quick context: I've got a #ReactJS #messagingApp (repo here: https://github.com/positive-intentions/chat) and a separate #UIFramework (repo here: https://github.com/positive-intentions/dim) built with #Lit (which uses Web Components). I'm genuinely wondering if there's a compelling #cybersecurity reason to refactor the chat app to use my #WebComponent UI framework. Might be a whole new level of #SecurityByDesign for #FrontEndDev.

FYI, same question's on Reddit here: https://www.reddit.com/r/ExperiencedDevs/comments/1lmk1rg/are_web_components_better_for_cybersecurity/, got some good #insights, but want to make sure nothing's getting overlooked! Let's discuss #InfoSec #WebDev #JavaScript #OpenSource #TechQuestion.