设计与多媒体

libraries-dev

jakubantalik/li…ries.dev

Use the Libraries.dev UI effect libraries correctly and find where they fit in a project. Covers Border beam (border-beam), Thinking orbs (thinking-orbs), Gooey (liquid-gooey), Voice (voice-glow), Bot avatars (bot-avatars), Liquid metal (metal-fx) and Image (img-fx). Use when adding an AI thinking or loading state, a glowing or animated border around an input or card, a voice or microphone visualizer, an animated bot or agent avatar, a liquid metal button or badge, an image generation placeholder or reveal, a gooey blob or liquid menu, or when the user mentions libraries.dev or any of these packages. Also "review my project for libraries.dev", "where could I use these effects", and the commands libraries reveal, libraries review, libraries apply.

  • 1044 次安装
  • 4500 星标
  • 收录于

安装命令

npx skills add https://github.com/jakubantalik/libraries.dev --skill libraries-dev

SKILL.md

Libraries.dev

Seven UI effect libraries for AI-era interfaces, each an npm package with a React component. This skill knows what each one is for, how to install it, and the options its libraries.dev detail page offers. Read the library's reference file before writing any code for it; never guess a prop.

Quick reference

Library Package Component Use it for Reference
Border beam border-beam BorderBeam A light that travels around an element's border: AI inputs, active cards, highlighted buttons. 01-border-beam.md
Thinking orbs thinking-orbs ThinkingOrb Small dot-orb indicators for what an agent is doing: thinking, searching, writing, listening. 02-thinking-orbs.md
Gooey liquid-gooey Liquid Liquid, melting and merging shapes and images: gooey menus, blob transitions, organic backdrops. 03-liquid-gooey.md
Voice voice-glow VoiceBeam An audio-reactive glow for voice input, dictation and voice agents. 04-voice-glow.md
Bot avatars bot-avatars BotAvatar Animated bot characters with idle and working states for agents and assistants. 05-bot-avatars.md
Liquid metal metal-fx MetalFx A real-time liquid metal material for buttons, badges, icons and text. 06-metal-fx.md
Image img-fx ImageGeneration Image generation placeholders and reveals while an image is being made or loaded. 07-img-fx.md