Loading video...

Video Failed to Load

Go Home

🎨 Native CSS Variables: change one token, update your whole site. Keep design systems tight with Oxygen 6

RealOxygenApp's profile picture

Oxygen

2,559 subscribers

84,594 views • 11 months ago •via X (Twitter)

Science & TechnologyEducationArts
LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Deployed the first Tailwind CSS v4-powered website to the internet this afternoon 🥳 Native cascade layers, `@​property` definitions, `color-mix()`, and variables galore 🤩
0:17

Deployed the first Tailwind CSS v4-powered website to the internet this afternoon 🥳 Native cascade layers, `@​property` definitions, `color-mix()`, and variables galore 🤩

Adam Wathan

91,538 views • 2 years ago

`autofill` on inputs is ugly by default the background bleed ruins the clean design systems, especially in dark mode. fixed it with a pure CSS inset shadow hack: autofill:shadow-[inset_0_0_0px_1000px_var(--color-background)] to force the background color and kill the native blue.
0:12

`autofill` on inputs is ugly by default the background bleed ruins the clean design systems, especially in dark mode. fixed it with a pure CSS inset shadow hack: autofill:shadow-[inset_0_0_0px_1000px_var(--color-background)] to force the background color and kill the native blue.

zenith

83,038 views • 3 months ago

The native token of Solana is at $47B. The native token of the ONE PIECE universe should be at…? When culture becomes tradable, ask yourself— what’s your valuation on the world’s most influential anime franchise? Prepare for $ONE ☝️
0:16

The native token of Solana is at $47B. The native token of the ONE PIECE universe should be at…? When culture becomes tradable, ask yourself— what’s your valuation on the world’s most influential anime franchise? Prepare for $ONE ☝️

Freya Protocol (Expanding into OneParadise)

17,359 views • 3 months ago

UPDATE: Spline's 3D Code API for SwiftUI is GA! Create custom 3D interactions for your iOS/macOS projects. - Trigger events and transitions - Change object properties - Update variables - and more! Try it now.
0:10

UPDATE: Spline's 3D Code API for SwiftUI is GA! Create custom 3D interactions for your iOS/macOS projects. - Trigger events and transitions - Change object properties - Update variables - and more! Try it now.

Spline

20,004 views • 10 months ago

✍️ New article: CSS cap unit A look at how I solved a design problem with CSS cap unit. 🔗
0:18

✍️ New article: CSS cap unit A look at how I solved a design problem with CSS cap unit. 🔗

Ahmad Shadeed

34,475 views • 2 years ago

Design Systems Database Massive collection of best-in-class design systems with visual styles, components and references from leading UI teams.
0:14

Design Systems Database Massive collection of best-in-class design systems with visual styles, components and references from leading UI teams.

Nick Babich

221,409 views • 2 years ago

Say hi to the Kibo UI QR Code shadcn component! 🔠 Pass in any string 💪 Adjustable level of robustness 🎨 Customizable styling 🧠 Works with the new OKLCH CSS variables 💻 React Server Component available ↔️ Infinitely scalable SVG Link 👇🧵
0:10

Say hi to the Kibo UI QR Code shadcn component! 🔠 Pass in any string 💪 Adjustable level of robustness 🎨 Customizable styling 🧠 Works with the new OKLCH CSS variables 💻 React Server Component available ↔️ Infinitely scalable SVG Link 👇🧵

Hayden Bleasel

21,110 views • 1 year ago

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)
0:15

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)

Stitch by Google

218,728 views • 2 months ago

With Design Mode, you can now point, draw, or talk to update your UI.
0:15

With Design Mode, you can now point, draw, or talk to update your UI.

Cursor

1,410,510 views • 4 days ago

💡 DevTools tip: You can make your console.log stand out by adding some CSS to it! 🎨
0:13

💡 DevTools tip: You can make your console.log stand out by adding some CSS to it! 🎨

bolt.new

32,471 views • 2 years ago

Ku-update token meter yako ni rahisi kama kucheza na Kale kateam *cough* Man U *cough* When your token meter is scheduled, you will receive two 20-digit codes via SMS with a guide on how to start the update process. Follow these free and super easy steps to update your token meter. #UsiachweGizani #UpdateTokenMeterYako ^JC
0:20

Ku-update token meter yako ni rahisi kama kucheza na Kale kateam *cough* Man U *cough* When your token meter is scheduled, you will receive two 20-digit codes via SMS with a guide on how to start the update process. Follow these free and super easy steps to update your token meter. #UsiachweGizani #UpdateTokenMeterYako ^JC

The Kenya Power & Lighting Company Plc.

544,499 views • 2 years ago

Hi CSS systems LTD, please kindly tell your driver to go fuck himself. Thanks A usually polite London cyclist
0:13

Hi CSS systems LTD, please kindly tell your driver to go fuck himself. Thanks A usually polite London cyclist

Cycling in London

166,689 views • 2 years ago

Your imagination is your tool 🫵🎨 It’s now your turn to design our PUMA Football 26/27 Third Kit with PUMA AI CREATOR 👕
0:15

Your imagination is your tool 🫵🎨 It’s now your turn to design our PUMA Football 26/27 Third Kit with PUMA AI CREATOR 👕

Manchester City

261,193 views • 1 year ago

Starting a HeroUI Native project just got a lot simpler 🎉 One command, a complete Expo router app: ✓ HeroUI Native ✓ Uniwind ✓ Tailwind CSS ✓ Every required peer dependency 𝗻𝗽𝘅 𝗰𝗿𝗲𝗮𝘁𝗲-𝗵𝗲𝗿𝗼𝘂𝗶-𝗻𝗮𝘁𝗶𝘃𝗲-𝗮𝗽𝗽@𝗹𝗮𝘁𝗲𝘀𝘁
0:20

Starting a HeroUI Native project just got a lot simpler 🎉 One command, a complete Expo router app: ✓ HeroUI Native ✓ Uniwind ✓ Tailwind CSS ✓ Every required peer dependency 𝗻𝗽𝘅 𝗰𝗿𝗲𝗮𝘁𝗲-𝗵𝗲𝗿𝗼𝘂𝗶-𝗻𝗮𝘁𝗶𝘃𝗲-𝗮𝗽𝗽@𝗹𝗮𝘁𝗲𝘀𝘁

HeroUI

15,255 views • 4 days ago

We’ve added a new command: npx shadcn apply. Instantly apply a full preset across your project. Swap components, themes, colors, CSS variables, fonts, and icons all at once. Apply. Test. Repeat.
0:19

We’ve added a new command: npx shadcn apply. Instantly apply a full preset across your project. Swap components, themes, colors, CSS variables, fonts, and icons all at once. Apply. Test. Repeat.

shadcn

136,795 views • 2 months ago

🚨 NEW: Plasma will launch its mainnet beta and native token XPL on September 25, with $2 billion in stablecoins active on the network from day one.
0:16

🚨 NEW: Plasma will launch its mainnet beta and native token XPL on September 25, with $2 billion in stablecoins active on the network from day one.

Cointelegraph

44,638 views • 8 months ago

UI/UX Designers, check this design systems database A massive collection of the best-in-class design systems with visual styles, components and references from leading UI teams. Website →
0:14

UI/UX Designers, check this design systems database A massive collection of the best-in-class design systems with visual styles, components and references from leading UI teams. Website →

Abraham John 🦄🦓

36,275 views • 2 years ago

$CORN is live on Oku! 🌽🌽🌽 Trade CORN's native token with ZERO platform fees
0:13

$CORN is live on Oku! 🌽🌽🌽 Trade CORN's native token with ZERO platform fees

Oku Trade 🐼

11,010 views • 1 year ago

let your links ✨dazzle✨ with CSS
0:17

let your links ✨dazzle✨ with CSS

jhey ʕ•ᴥ•ʔ

31,590 views • 1 year ago

When your wife magic touch ,change your whole appearance
0:13

Sensitive content

When your wife magic touch ,change your whole appearance

Oj Patsy 💕

491,652 views • 1 month ago