본문으로 건너뛰기
cccskills

OpenDesign

@nexu-io

조직

The open-source stack for your design system.

스킬 669개저장소 14개 12.4만

스킬(669)

검색에서 좁히기

A fluid-simulation cursor — pointer movement splats swirling, glowing dye (full multi-pass WebGL fluid sim). A marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A soft light rotates around a pill/button border — a gentle animated outline for a single CTA. One per view; keep it slow and low-contrast. Pure CSS; static border under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Give one hero card or CTA quiet premium life: a soft band of light travels around its border. One shining element per view; keep it slow and low-contrast. Pure CSS. Fully static under prefers-reduced-motion. Do not put several on screen at once.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Reveal content as it scrolls into view — a gentle rise + fade, once per element. Use to give a long page calm rhythm. Honors prefers-reduced-motion and supports staggering. Do not delay above-the-fold content, and keep at most a few elements animating at once.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

prism

무료

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

plasma

무료

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Letters shuffle through random neighbors then settle into the word — a quick playful reveal for a short label. Final text is the real content; instant under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

One word swaps for the next in place — a compact way to cycle a few phrases in a headline. One rotator per view; short words. Under prefers-reduced-motion it swaps text with no travel.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Resolve one short headline from random glyphs — a techy decode reveal. One short line only; keep it fast. The resolved text is the real, accessible content; under prefers-reduced-motion it appears instantly with no scramble. Avoid on body copy and calm/luxury tones.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

strands

무료

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

side-rays

무료

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A switch whose knob springs across on toggle — a tactile, satisfying on/off state change. Use for settings/form switches. Honors prefers-reduced-motion (quick linear slide). Trigger on user intent only; keep the spring subtle — never to convey loading/progress.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A soft highlight sweeps across muted text — a quiet premium shimmer for one short label ("new", "pro", a CTA word). Keep the base text readable; one or two per view. Pure CSS; solid under reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

An animated target ring replaces the cursor and grows when it hovers buttons/links — a focused, techy pointer. One per page. Off on touch and under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Words sit softly blurred; one snaps into focus at a time — leads the eye across a short phrase. One per view; short phrases. Under prefers-reduced-motion all words stay sharp.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Rise + fade list items in one after another on load, staggered by order. Use for short, above-the-fold lists, menus, or nav. Honors prefers-reduced-motion. For long or off-screen lists use scroll-reveal instead; never gate must-scan content on the animation.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

Give feature/pricing cards a premium feel: a soft radial spotlight follows the cursor across the card and lifts its border. Keep the glow subtle and low-contrast. Falls back to a plain static border under prefers-reduced-motion and on touch. Do not use on text-dense reading surfaces.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

radar

무료

A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

waves

무료

A perlin-warped line field with a pointer wake — organic flowing lines. A marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

stepper

무료

An animated step indicator fills as you advance — clear progress for a multi-step flow (checkout, onboarding). One per flow. Under prefers-reduced-motion fills without easing.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

nexu-io/motion-anything9462026년 7월 7일 업데이트

본인 계정인가요? GitHub를 연동하면 크리에이터 페이지에 모을 수 있습니다 (일본어)