Загрузка видео...

Не удалось загрузить видео

На главную

Got inspired by Resend's keyboard component, made something similar using pure CSS. This way, its configurable during runtime, so you can change the text and colour to your liking.

BalintFerenczy's profile picture

balint

2,686 subscribers

185,530 просмотров • 11 месяцев назад •via X (Twitter)

Наука и технологииОбразованиеИскусство
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

dot matrix tricker component made with css and canvas inspired by Marijana Pavlinić's wonderful portfolio → (still wip)
0:28

dot matrix tricker component made with css and canvas inspired by Marijana Pavlinić's wonderful portfolio → (still wip)

Maxime

14,670 просмотров • 7 месяцев назад

Build UI interactions in Rive like this smooth, responsive disclosure inspired by Nitish Khagwal. Using the Layout direction feature (in Early Access), it just takes a single property to add support for RTL languages and you can populate your text dynamically at runtime.
0:31

Build UI interactions in Rive like this smooth, responsive disclosure inspired by Nitish Khagwal. Using the Layout direction feature (in Early Access), it just takes a single property to add support for RTL languages and you can populate your text dynamically at runtime.

Philip Chung

30,683 просмотров • 1 год назад

This octopus-camouflage inspired polymer can change colour and texture.
2:02

This octopus-camouflage inspired polymer can change colour and texture.

nature

26,036 просмотров • 5 месяцев назад

Made a random projects during the end sem : Make your retro photos using it and post it on Twitter 😋 - you can add different filters in your image - can change the background colour - can download the png - mobile responsive too Here is the link:
1:35

Made a random projects during the end sem : Make your retro photos using it and post it on Twitter 😋 - you can add different filters in your image - can change the background colour - can download the png - mobile responsive too Here is the link:

Sam ☕

24,636 просмотров • 6 месяцев назад

Created this fully "accessible" dropdown using pure Tailwind CSS 🤩 × No javascript × No custom styles Can you guess which CSS property is this?
0:21

Created this fully "accessible" dropdown using pure Tailwind CSS 🤩 × No javascript × No custom styles Can you guess which CSS property is this?

Surjith S M ✪

169,682 просмотров • 3 лет назад

there is something off about this design - it's the vertical text alignment this new CSS feature just made aligning text 100x easier
2:17

there is something off about this design - it's the vertical text alignment this new CSS feature just made aligning text 100x easier

Wes Bos

45,213 просмотров • 5 месяцев назад

made typo - a typing test website inspired by this cool keyboard link in comments do checkout and lemme know your scores :)
0:38

made typo - a typing test website inspired by this cool keyboard link in comments do checkout and lemme know your scores :)

Khushi🪐

29,883 просмотров • 2 месяцев назад

Row-level actions + confirmation toast. Interaction design made entirely in Figma using component states and some keyboard hacks 😁
0:21

Row-level actions + confirmation toast. Interaction design made entirely in Figma using component states and some keyboard hacks 😁

virgil pana

15,506 просмотров • 11 месяцев назад

I made a midi controller with Svelte. This thing can be played by your computer keyboard, top two rows for keys, bottom row for chords. In locked key mode, you can change the key and play all chords within that key.
0:24

I made a midi controller with Svelte. This thing can be played by your computer keyboard, top two rows for keys, bottom row for chords. In locked key mode, you can change the key and play all chords within that key.

Scott Tolinski - Syntax.fm

30,503 просмотров • 1 год назад

New timeline component pushes CSS grid to its absolute limit 🥵
0:22

New timeline component pushes CSS grid to its absolute limit 🥵

Caleb Porzio ⚡️

150,687 просмотров • 3 месяцев назад

Stickers made with css and svg filters, inspired by the awesome work of Mats Erdkamp and Guillermo Rauch The peel effect is entirely CSS (transformations and masking), while the sticker outline, the shadow, and the lighting was created using SVG filters. Codepen dropping soon below!
0:27

Stickers made with css and svg filters, inspired by the awesome work of Mats Erdkamp and Guillermo Rauch The peel effect is entirely CSS (transformations and masking), while the sticker outline, the shadow, and the lighting was created using SVG filters. Codepen dropping soon below!

balint

55,512 просмотров • 11 месяцев назад

Built a modular and dynamic CHUNK type system component in Framer using React and pure CSS. I created a responsive construction system first, then hand crafted every single letter and number in CSS so each glyph has its own structure, balance and character. As the frame changes, the typography reshapes rather than just scales. Part font, part layout engine, part self-inflicted obsession.
0:41

Built a modular and dynamic CHUNK type system component in Framer using React and pure CSS. I created a responsive construction system first, then hand crafted every single letter and number in CSS so each glyph has its own structure, balance and character. As the frame changes, the typography reshapes rather than just scales. Part font, part layout engine, part self-inflicted obsession.

Lee Black

10,580 просмотров • 2 месяцев назад

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source
0:40

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source

Om Patel

152,303 просмотров • 2 месяцев назад

Created by the best, vetted by your favorites, the ALIENWARE Pro Line will change the way you play🏆 Get ready to #BreakThroughYourGame with the Alienware Pro Wireless Mouse & Keyboard 👽
0:47

Created by the best, vetted by your favorites, the ALIENWARE Pro Line will change the way you play🏆 Get ready to #BreakThroughYourGame with the Alienware Pro Wireless Mouse & Keyboard 👽

Team Liquid

192,175 просмотров • 2 лет назад

ok.. this is crazy OpenAI 4o now can generate and edit image with text prompt, you can change small detail like text, logo and.. it's super accurate 100% AI. 10 examples: 1. design a name card for Elon Musk, and change logo, name, phone number and colour
0:23

ok.. this is crazy OpenAI 4o now can generate and edit image with text prompt, you can change small detail like text, logo and.. it's super accurate 100% AI. 10 examples: 1. design a name card for Elon Musk, and change logo, name, phone number and colour

el.cine

317,766 просмотров • 1 год назад

CSS Tip! ✨ You can make your component styles portable with container queries 😎 Change a card layout based on size 🔥 Remove button text when it's small 🤏 .card {container-type: inline-size;} @ container (min-width: 50ch) {.info { grid-column: 2; }} CodePen.IO link below 👇
0:28

CSS Tip! ✨ You can make your component styles portable with container queries 😎 Change a card layout based on size 🔥 Remove button text when it's small 🤏 .card {container-type: inline-size;} @ container (min-width: 50ch) {.info { grid-column: 2; }} CodePen.IO link below 👇

jhey ʕ•ᴥ•ʔ

311,452 просмотров • 2 лет назад

1. Convert UI design to front-end code Prompt: Convert this design into a react component using tailwind css
0:28

1. Convert UI design to front-end code Prompt: Convert this design into a react component using tailwind css

Robin Delta

41,075 просмотров • 2 лет назад

If you have an asset in Figma and you'd like to change it's colour to your perferred colour (quick and efficient way), layer the colour over the image in "Fill" properties and apply a *colour* mix-blend mode to it. Exporting it as an asset has a different workflow.
0:45

If you have an asset in Figma and you'd like to change it's colour to your perferred colour (quick and efficient way), layer the colour over the image in "Fill" properties and apply a *colour* mix-blend mode to it. Exporting it as an asset has a different workflow.

seyi

16,832 просмотров • 1 год назад

This is text to video Burning Man I made today. A video made just by writing text! Made using Runway and #Gen2 Music isA.I. generated with Mubert.
0:39

This is text to video Burning Man I made today. A video made just by writing text! Made using Runway and #Gen2 Music isA.I. generated with Mubert.

Kris Kashtanova

340,582 просмотров • 3 лет назад

The way you interact with your PC is changing. “We believe this shift to conversational input will be as transformative as the mouse and keyboard.” Meet the computer you can talk to.
0:24

The way you interact with your PC is changing. “We believe this shift to conversational input will be as transformative as the mouse and keyboard.” Meet the computer you can talk to.

Windows

53,051 просмотров • 7 месяцев назад