Loading video...

Video Failed to Load

Go Home

Introducing the WebGL component skill Fully free, helping agents keep accessibility and performance in mind. Shaders, Liquid Glass, you name it. npx skills add flornkm/skills

flornkm's profile picture

Florian

12,994 subscribers

19,871 views • 2 months ago •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Excited to publish my first skill: Prefer Container Queries It makes components respond to their container's width, not the viewport - so the same component adapts anywhere you drop it. npx skills add flornkm/skills
0:18

Excited to publish my first skill: Prefer Container Queries It makes components respond to their container's width, not the viewport - so the same component adapts anywhere you drop it. npx skills add flornkm/skills

Florian

78,935 views • 2 months ago

Introducing text-to-lottie: an open source skill and harness for generating production ready Lottie animations with codex/claude code. $ npx skills add diffusionstudio/lottie Prompts guide and repo in the comments.
0:12

Introducing text-to-lottie: an open source skill and harness for generating production ready Lottie animations with codex/claude code. $ npx skills add diffusionstudio/lottie Prompts guide and repo in the comments.

konstantinpaulus

883,456 views • 4 months ago

A few examples of using the Transitions skill + Border Beam and Metal effects in a real UI in the Logram app npx skills add Jakubantalik/transitions.dev
0:14

A few examples of using the Transitions skill + Border Beam and Metal effects in a real UI in the Logram app npx skills add Jakubantalik/transitions.dev

Jakub Antalik

47,565 views • 2 months ago

Created a new skill Transition polish The skill is focused on transition refinement by adjusting motion tokens instead of replacing the whole transition. npx skills add Jakubantalik/transitions.dev -s transitions-polish Or use it with Refine tool (visual layer for the skill) npx transitions-refine live
0:10

Created a new skill Transition polish The skill is focused on transition refinement by adjusting motion tokens instead of replacing the whole transition. npx skills add Jakubantalik/transitions.dev -s transitions-polish Or use it with Refine tool (visual layer for the skill) npx transitions-refine live

Jakub Antalik

29,826 views • 3 months ago

We published a skill for Omni Flash so you can bootstrap video editing into your agent: ``` npx skills add google-gemini/gemini-skills --skill gemini-omni-flash-api ``` The skill covers the core workflows: - Text to video - Image references to video - First frame to video - Conversational video editing
0:10

We published a skill for Omni Flash so you can bootstrap video editing into your agent: ``` npx skills add google-gemini/gemini-skills --skill gemini-omni-flash-api ``` The skill covers the core workflows: - Text to video - Image references to video - First frame to video - Conversational video editing

Philipp Schmid

54,941 views • 3 months ago

Added 3 new transitions to You can grab them as a code or install them with the others as a skill npx skills add jakubantalik/transitions-dev
0:17

Added 3 new transitions to You can grab them as a code or install them with the others as a skill npx skills add jakubantalik/transitions-dev

Jakub Antalik

87,871 views • 5 months ago

Added 7 new transitions for agentic UI to library, 32+ free transitions total Copy the code or use them via the skill for Claude, Cursor, or Codex. npx skills add jakubantalik/transitions.dev
0:17

Added 7 new transitions for agentic UI to library, 32+ free transitions total Copy the code or use them via the skill for Claude, Cursor, or Codex. npx skills add jakubantalik/transitions.dev

Jakub Antalik

30,862 views • 1 month ago

Introducing React Native Doctor Find performance and security bugs in your mobile app Run via CLI and fix with agents. Fully open source npx react-doctor@latest
0:17

Introducing React Native Doctor Find performance and security bugs in your mobile app Run via CLI and fix with agents. Fully open source npx react-doctor@latest

Aiden Bai

172,586 views • 4 months ago

Introducing Solana Agent Skills Pre-built skills you can drop into AI tools to interact with Solana. Install in one line and build agents that know Solana.
0:18

Introducing Solana Agent Skills Pre-built skills you can drop into AI tools to interact with Solana. Install in one line and build agents that know Solana.

Solana Foundation

383,818 views • 6 months ago

I’ve been using 60% Apple-style corner smoothing all the time. But whenever I explain it to Codex or Claude Code, they often miss the point. So I made a skill that anyone can use with their AI agents: npx skills add gabrielobholz/corner-smoothing-skill Now I can simply say: “Create a rectangle with radius: 32 and smoothing: 60” and get the shape I actually mean.
0:14

I’ve been using 60% Apple-style corner smoothing all the time. But whenever I explain it to Codex or Claude Code, they often miss the point. So I made a skill that anyone can use with their AI agents: npx skills add gabrielobholz/corner-smoothing-skill Now I can simply say: “Create a rectangle with radius: 32 and smoothing: 60” and get the shape I actually mean.

Gabriel

97,712 views • 3 months ago

introducing: liquid glass element for Framer a draggable frosted glass effect that feels tactile and smooth — perfect for adding depth to any layout. comment "GLASS" and i’ll send you the comp for free :)
0:11

introducing: liquid glass element for Framer a draggable frosted glass effect that feels tactile and smooth — perfect for adding depth to any layout. comment "GLASS" and i’ll send you the comp for free :)

Framer University

44,108 views • 1 year ago

Opus 5.5 just f*cking killed the jobs of motion designers... Claude Code + Remotion = your own motion design studio give it a brief, your assets, and a reference build the scenes as editable React code 01 direct the scene layout, typography, colors, and reusable components 02 make it move timing, easing, keyframes, transitions, and layered animation 03 polish the result preview the frames, fix the spacing, adjust the pacing, and render the MP4 the clever part: your video lives in code change the headline, fonts, format, or motion curve → render again the repo: ▸ start a project: npx create-video@latest add the official Remotion skills: npx skills add remotion-dev/skills skills for coding agents: ▸ the loop: brief → storyboard → assets → layout → animate → preview → refine → render save this, then read the full guide for Opus 5.5 Motion Engineering ↓
0:15

Opus 5.5 just f*cking killed the jobs of motion designers... Claude Code + Remotion = your own motion design studio give it a brief, your assets, and a reference build the scenes as editable React code 01 direct the scene layout, typography, colors, and reusable components 02 make it move timing, easing, keyframes, transitions, and layered animation 03 polish the result preview the frames, fix the spacing, adjust the pacing, and render the MP4 the clever part: your video lives in code change the headline, fonts, format, or motion curve → render again the repo: ▸ start a project: npx create-video@latest add the official Remotion skills: npx skills add remotion-dev/skills skills for coding agents: ▸ the loop: brief → storyboard → assets → layout → animate → preview → refine → render save this, then read the full guide for Opus 5.5 Motion Engineering ↓

beamnxw ./

30,924 views • 8 days ago

Claude Code can now go find the right skill itself, instead of you searching for one. it's called find-skills. a small package that plugs into Claude Code, and instead of you hunting for rest, you just describe the task and it searches the whole open skills ecosystem, finds the ones that fit, and installs them for you. > tell it what you're trying to do, in plain english > it scans the skills registry and maps your task to real skills > it pulls the right ones in and sets them up half the time you don't even know a skill exists for what you're doing. now you don't have to.
0:16

Claude Code can now go find the right skill itself, instead of you searching for one. it's called find-skills. a small package that plugs into Claude Code, and instead of you hunting for rest, you just describe the task and it searches the whole open skills ecosystem, finds the ones that fit, and installs them for you. > tell it what you're trying to do, in plain english > it scans the skills registry and maps your task to real skills > it pulls the right ones in and sets them up half the time you don't even know a skill exists for what you're doing. now you don't have to.

Alvaro Cintas

38,829 views • 2 months ago

introducing: 3D image scan effect for Framer. fully customizable, with built-in interactivity and multiple visual modes. retweet & comment the word "SCAN" and i'll send you the component for free :)
0:18

introducing: 3D image scan effect for Framer. fully customizable, with built-in interactivity and multiple visual modes. retweet & comment the word "SCAN" and i'll send you the component for free :)

Framer University

13,224 views • 1 year ago

introducing: interactive animated 3d globe for Framer. a fully customizable globe with rotation, drag, markers, and visual styling. comment “GLOBE” and i’ll send you the component for free :)
0:10

introducing: interactive animated 3d globe for Framer. a fully customizable globe with rotation, drag, markers, and visual styling. comment “GLOBE” and i’ll send you the component for free :)

Framer University

42,634 views • 10 months ago

We heard you – now you can add Skills to Dia with one click. Browse the marketplace, add your favorites, and start using new Skills instantly. Our team is on fire. Big Dia upgrades arriving in the coming weeks. Dia is about to get much smarter and more personalized!
0:16

We heard you – now you can add Skills to Dia with one click. Browse the marketplace, add your favorites, and start using new Skills instantly. Our team is on fire. Big Dia upgrades arriving in the coming weeks. Dia is about to get much smarter and more personalized!

Josh Miller

43,881 views • 1 year ago

Get beautiful text animations. We built a hand-crafted collection of text animations and wrapped them as a SKILL for your AI agent. Use it with Remotion, Motion, GSAP, WAAPI, or any animation library. It comes with clear animation specs - pacing, curves, transitions - so your output looks great from the first prompt. Install it with: npx skills add pixel-point/animate-text --skill animate-text Use it /animate-text apply soft-blur-in to hero section text
0:13

Get beautiful text animations. We built a hand-crafted collection of text animations and wrapped them as a SKILL for your AI agent. Use it with Remotion, Motion, GSAP, WAAPI, or any animation library. It comes with clear animation specs - pacing, curves, transitions - so your output looks great from the first prompt. Install it with: npx skills add pixel-point/animate-text --skill animate-text Use it /animate-text apply soft-blur-in to hero section text

Alex Barashkov

129,508 views • 6 months ago

iOS 26.4 beta 4 adds a “Reduce Bright Effects” toggle to minimize highlighting and flashing when interacting with Liquid Glass elements. You can find it in Settings > Accessibility > Display & Text Size.
0:16

iOS 26.4 beta 4 adds a “Reduce Bright Effects” toggle to minimize highlighting and flashing when interacting with Liquid Glass elements. You can find it in Settings > Accessibility > Display & Text Size.

Beta Profiles

261,249 views • 7 months ago

For skills that include a map, when you equip the skill and then go in and out of the settings tab, the cursor gets stuck and you can't use the skill. Riot Riviere Riot Nu (Marcus Reid)
0:17

For skills that include a map, when you equip the skill and then go in and out of the settings tab, the cursor gets stuck and you can't use the skill. Riot Riviere Riot Nu (Marcus Reid)

valohabercisi

443,119 views • 4 months ago