> ## Content Index
> Fetch the complete content index at: https://tailwindweekly.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# Tailwind Weekly #234: Zero-JS video embeds, cool shadcn resources & operators galore ✨
- URL: https://tailwindweekly.com/issue-234/
- Published: 2026-10-10T12:00:35.000Z
- Updated: 2026-10-10T12:00:35.000Z
- Author: Vivian Guillen

Hello folks!

Zard UI hits 1.0, Maizzle 6.2 lands, and there's a fresh batch of shadcn components. Stefan Bauer lazy-loads YouTube embeds with nothing but `<details>`, Max Prilutskiy rounds up eight HTML elements you're probably skipping, and Vite+ wraps your whole toolchain in one CLI.

Let's dive in 👇

## **🌟 Community News**

[![](https://tailwindweekly.com/content/images/2026/10/screenshot-1366x768-1791589658761.webp)](https://zardui.com/?ref=tailwindweekly.com)

### [Zard UI hits 1.0](https://zardui.com/?ref=tailwindweekly.com)

Zard UI, the shadcn/ui alternative for Angular, is out of beta. v1.0.0 landed on Oct 8 after 134 betas, and it adds two components: Attachment, for files and images, and Aspect Ratio. 

### [Maizzle v6.2.0](https://github.com/maizzle/framework/releases/tag/v6.2.0?ref=tailwindweekly.com)

Maizzle 6.2 adds `definePreviewProps`, so you can feed sample data to a template in the dev server, and `createMaizzle`, which lets you reuse one renderer across renders. It also warns you now when a `<style>` tag fails to compile.

### [mdxcn joins shadcn-labs](https://mdxcn.dev/?ref=tailwindweekly.com)

mdxcn is a set of Markdown-friendly React components you copy into your app, shadcn-style, with charts and diagrams drawn in text glyphs instead of SVG or canvas. It moved under shadcn-labs on Oct 6, and an Oct 2 update added nine components, including Chat, Env, Endpoint, Keys, FAQ, and two new graphs.

### New components in the shadcn ecosystem

Five registries shipped new pieces this week.

- [**@react-bits**](https://reactbits.dev/?ref=tailwindweekly.com): HoloCard and CrystalizedBall.
- [**@beui**](https://beui.dev/?ref=tailwindweekly.com): a voice orb, a directional arc picker, a morphing aspect ratio, animated collapsible and alert, and status bar, volume profile, and treemap charts.
- [**@reui**](https://reui.io/docs/changelog?ref=tailwindweekly.com) v2.7.0: Signature Pad and Time Picker primitives with free examples, plus three new Pro block categories (Tiptap rich text editor, Excalidraw whiteboard, and DevOps).
- [**shadcn-svelte**](https://shadcn-svelte.com/?ref=tailwindweekly.com): Questionnaire and MessageScroller, plus a new `@shadcn-svelte/primitives` package.
- [**@remocn**](https://www.remocn.dev/?ref=tailwindweekly.com): 31 transcript-driven caption styles for Remotion videos.

## **🤩 Windy Picks**

[![](https://tailwindweekly.com/content/images/2026/09/windy-cozywatch.png)](https://www.cozywatch.com/download/?ref=tailwindweekly.com)

### [Cozy Watch](https://www.cozywatch.com/?ref=tailwindweekly.com&aff=lVeE1) — GitHub notifications in your Mac menu bar

Cozy Watch is an open-source macOS app that pings you when a pull request, review, mention, or CI run needs you. Click through and you land on the PR that changed, and the menu bar shows your current PR status. It's free for personal use, with a $29/year license for work that comes with a 30-day commercial trial. macOS 12 or later.

[**Download Cozy Watch, free for personal use**](https://www.cozywatch.com/download/?ref=tailwindweekly.com&aff=lVeE1)

## **📚 Learning**

[![](https://tailwindweekly.com/content/images/2026/10/learn-video-embeds.jpg)](https://frontendmasters.com/blog/performance-optimized-video-embeds-with-zero-javascript/?ref=tailwindweekly.com)

### [Performance-Optimized Video Embeds with Zero JavaScript](https://frontendmasters.com/blog/performance-optimized-video-embeds-with-zero-javascript/?ref=tailwindweekly.com)

Stefan Bauer lazy-loads YouTube iframes with `<details>` and `<summary>`. The thumbnail sits in the summary, and the player only loads once someone clicks. In his tests it beat `lite-youtube-embed` on load time, LCP, and transfer size, with zero JavaScript shipped.

### [HTML5 Elements You Didn't Know You Need](https://dev.to/maxprilutskiy/html5-elements-you-didnt-know-you-need-gan?ref=tailwindweekly.com)

Max Prilutskiy rounds up eight native elements that replace a chunk of JavaScript, from `<dialog>` modals and `<details>` accordions to `<datalist>` autocomplete, `<meter>`, `<output>`, and `<time>`. Each one comes with copy-ready code and a note on its limits, like not being able to style `<datalist>` options.

### [JavaScript Operators you should know](https://www.youtube.com/watch?v=yP9g2k6-zXQ&ref=tailwindweekly.com)

Chris from Coding in Public walks through `&&`, `||`, and `??` in a 10-minute video, then moves on to the logical assignment versions: `&&=`, `||=`, and `??=`. His `tokensRemaining: 0` example shows why you want `??` over `||` when zero is a valid value.

## **💅 Showcase**

[![](https://tailwindweekly.com/content/images/2026/10/showcase-viteplus.jpg)](https://viteplus.dev/?ref=tailwindweekly.com)

### [Vite+](https://viteplus.dev/?ref=tailwindweekly.com)

Vite+ is a unified toolchain that bundles Vite, Vitest, Rolldown, tsdown, Oxlint, Oxfmt, and Vite Task behind one `vp` CLI. You get `vp dev`, `vp check`, `vp test`, and `vp build`, plus Node.js and package manager management, and `vp migrate` for existing Vite projects. 

## **🎁 Resource**

[![](https://tailwindweekly.com/content/images/2026/10/resource-emailcn.png)](https://www.emailcn.run/?ref=tailwindweekly.com)

### [emailcn](https://www.emailcn.run/?ref=tailwindweekly.com)

If you've ever hand-coded table layouts for an email, this one's for you. emailcn is a free, MIT-licensed set of email components for React Email, MJML React, and JSX Email that you install with the shadcn CLI, like `npx shadcn add @emailcn/react-email/image-grid-hero`. You get heroes, pricing, product lists, order summaries, and more, with built-in themes like Vercel, Linear, and Stripe. The code lands in your project, so you can tweak every block.

## **👌 Cool Stuff**

[**Tiiny Host**](https://tiiny.host/?fpr=vivian32&ref=tailwindweekly.com) – Drag and drop an HTML file, PDF, or zipped static site and get a shareable link with free SSL in seconds.

[**Nushell**](https://www.nushell.sh/?ref=tailwindweekly.com) – Cross-platform shell where pipelines pass structured data, so you filter and sort tables instead of parsing strings, with JSON, YAML, SQLite, and Excel support built in.

[**Upscayl**](https://upscayl.org/?ref=tailwindweekly.com) – Free, open-source desktop app for Linux, macOS, and Windows that upscales images up to 16x with AI, with batch mode and multiple models.

Do you want to share something with the Tailwind CSS community?  
You can [submit a link](https://forms.gle/2WhynnUkJTHkM7746?ref=tailwindweekly.com) or message me on Twitter [@vivgui](https://twitter.com/vivgui?ref=tailwindweekly.com).

Want to support the newsletter? You can buy me a coffee with this [link](https://buymeacoffee.com/vivgui?ref=tailwindweekly.com) 😁.