New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Creating Reanimated Animations

by gluestack in gluestack/gluestack-ui

Generate React Native Reanimated animation code for React Native apps.

No licenceAuto-check passedMobile

Install Creating Reanimated Animations

skills CLI
$ npx skills add gluestack/gluestack-ui --skill creating-reanimated-animations -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install gluestack/gluestack-ui creating-reanimated-animations --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/gluestack/gluestack-ui.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/creating-reanimated-animations .claude/skills/creating-reanimated-animations && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
creating-reanimated-animations
GitHub stars
5.3k
Token cost
~2.4k tokens
SKILL.md length
490 words
Files
9 (incl. references)
Skills in repo
11
Repo updated
First seen
Licence
None found

At a glance

Generate React Native Reanimated animation code for React Native apps.

  • User asks to create
  • SKILL.md covers Version Detection, Setup, Core Pattern and Animation Selection, plus 11 more sections
  • Calls npm and npx
  • Add animations in React Native — including transitions

What it does

Creating Reanimated Animations is an agent skill from gluestack/gluestack-ui. Generate React Native Reanimated animation code for React Native apps. Use when user asks to create, implement, or add animations in React Native — including transitions, gestures, scroll-linked effects, layout animations, layout transitions, entering/exiting animations, CSS animations, CSS transitions, shared element transitions, color animations, parallax, fade, slide, scale, spring, timing, decay, keyframes, worklets, accordion, bottom sheet, flip card, collapsing header, or any motion effect using…

Its SKILL.md is about 2.4k tokens, which your agent loads only when the skill is triggered. The skill folder holds 9 other files, including reference files (for example `references/api-reference.md`, `references/component-patterns.md` and `references/css-animations-detailed.md`).

It sits in Mobile, covering Cross-platform mobile apps, Web animation and motion and Slides and decks. It works with React Native and Jest. The repository describes itself as: React & React Native Components & Patterns (copy-paste components & patterns crafted with Tailwind CSS (NativeWind)).

When your agent uses it

  • User asks to create
  • Add animations in React Native — including transitions
  • Scroll-linked effects
  • Layout animations

Example prompts

  • “/creating-reanimated-animations”

Requirements

  • Node.js

What it can do on your machine

Read from SKILL.md and the folder at commit b712c85. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npm
    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • github.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Creating Reanimated Animations loads about 2.4k tokens when it runs, and up to ~18k if it reads all its reference files. Until then it costs about 190 tokens; SKILL.md has 490 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~190
When it runs · the whole SKILL.md, loaded when a task matches
~2.4k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~18k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

Without a licence we can't republish the file, so here is its outline and opening line. It has 490 words (~2,386 tokens).

“Generate performant animation code using React Native Reanimated. Supports both v3 and v4.”

— opening of SKILL.md by gluestack
name
creating-reanimated-animations

Read the full SKILL.md on GitHub

Files

SKILL.md and 8 other files (references) in .agents/skills/creating-reanimated-animations of gluestack/gluestack-ui.

  • SKILL.md
  • references/api-reference.md
  • references/component-patterns.md
  • references/css-animations-detailed.md
  • references/gesture-patterns.md
  • references/layout-animations.md
  • references/shared-element-transitions.md
  • references/testing-and-properties.md
  • references/worklets-advanced.md

Open the folder on GitHubat commit b712c85

Compare with similar skills

Creating Reanimated Animations next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Creating Reanimated Animations compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Creating Reanimated Animations this skillgluestack/gluestack-ui5.3k—~2.4kAutomated safety check: PassNone
React Native Testingcallstackincubator/agent-skills1.7k—~1.8kAutomated safety check: PassMIT
React Native TestingHoangNguyen0403/agent-skills-standard571—~647Automated safety check: PassMIT
Cometchat React Native Testingcometchat/cometchat-skills131—~997Automated safety check: PassMIT
Test Guidelinesgetsentry/sentry-react-native1.8k—~1.3kAutomated safety check: PassMIT
Cue AnimationsMilad-Akarie/cue1191 repos~6.6kAutomated safety check: PassMIT

Similar skills

  • React Native Testing

    callstackincubator/agent-skills

    Official

    Write tests using React Native Testing Library (RNTL) v13 and v14 (@testing-library/react-native).

    1.7k GitHub stars~1.8k tokensUpdated yesterday
    MobileAuto-check passed

  • React Native Testing

    HoangNguyen0403/agent-skills-standard

    Test React Native components with Jest and React Native Testing Library.

    571 GitHub stars~647 tokensUpdated yesterday
    MobileAuto-check passed

  • Cometchat React Native Testing

    cometchat/cometchat-skills

    Test a CometChat React Native integration — mock the SDK for Jest unit tests, assert init-before-render ordering and no-Auth-Key-in-source, and use Detox for the flows only a device can prove.

    131 GitHub stars~997 tokensUpdated 4 days ago
    Testing & QAAuto-check passed

  • Test Guidelines

    getsentry/sentry-react-native

    Official

    Enforce Sentry React Native SDK test conventions for naming, structure, mocking, and fixtures with Jest.

    1.8k GitHub stars~1.3k tokensUpdated yesterday
    Testing & QAAuto-check passed

  • Cue Animations

    Milad-Akarie/cue

    Flutter animation using the Cue package. An agent skill from Milad-Akarie/cue.

    119 GitHub starsUsed in 1 repo~6.6k tokens
    MobileAuto-check passed

  • Expo Animation

    expo/skills

    Official

    Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread it runs on, which properties, spring or timing…

    2.7k GitHub starsUsed in 6 repos~4.7k tokens
    MobileAuto-check passed

More from gluestack/gluestack-ui

All 11 skills in this repo

  • Monorepo Management

    gluestack/gluestack-ui

    Master monorepo management with Turborepo, Nx, and pnpm workspaces to build efficient, scalable multi-package repositories with optimized builds and dependency management.

    5.3k GitHub starsUsed in 12 repos~3.2k tokens
    Auto-check: warnings

  • Contribute

    gluestack/gluestack-ui

    Main entry point for gluestack-ui contributor tasks and workflows

    5.3k GitHub stars~857 tokensUpdated 1 mo ago
    Auto-check passed

  • Create Docs

    gluestack/gluestack-ui

    Create or update component documentation with examples, API reference, and best practices

    5.3k GitHub stars~3.3k tokensUpdated 1 mo ago
    Auto-check passed

  • Create Package

    gluestack/gluestack-ui

    Create or modify gluestack-core and gluestack-utils packages for component creators and utilities

    5.3k GitHub stars~4.6k tokensUpdated 1 mo ago
    Auto-check passed

  • Enhance Component

    gluestack/gluestack-ui

    Improve or extend an existing gluestack-ui component with new features, variants, or fixes

    5.3k GitHub stars~2.5k tokensUpdated 1 mo ago
    Auto-check passed

  • Gluestack UI V4

    gluestack/gluestack-ui

    Enforces constrained, opinionated styling patterns for gluestack-ui v4.

    5.3k GitHub stars~2.1k tokensUpdated 1 mo ago
    Auto-check passed

Works with

Categories

Questions about Creating Reanimated Animations

What does Creating Reanimated Animations do?

Generate React Native Reanimated animation code for React Native apps. Creating Reanimated Animations is an agent skill from gluestack/gluestack-ui. Generate React Native Reanimated animation code for React Native apps.

When should I use Creating Reanimated Animations?

Creating Reanimated Animations fits situations like: user asks to create; add animations in React Native — including transitions; scroll-linked effects; layout animations.

How do I install Creating Reanimated Animations in Claude Code?

Run `npx skills add gluestack/gluestack-ui --skill creating-reanimated-animations -a claude-code`. Or copy the skill folder (.agents/skills/creating-reanimated-animations in gluestack/gluestack-ui) into .claude/skills/creating-reanimated-animations in your project. Claude Code loads it when a task matches its description.

How do I install Creating Reanimated Animations in Codex?

Run `npx skills add gluestack/gluestack-ui --skill creating-reanimated-animations -a codex`. Or copy the skill folder (.agents/skills/creating-reanimated-animations in gluestack/gluestack-ui) into .agents/skills/creating-reanimated-animations in your project. Codex loads it when a task matches its description.

Can I use Creating Reanimated Animations in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add gluestack/gluestack-ui --skill creating-reanimated-animations -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/creating-reanimated-animations, .gemini/skills/creating-reanimated-animations, .github/skills/creating-reanimated-animations and .opencode/skills/creating-reanimated-animations in your project.

What does Creating Reanimated Animations need to run?

Going by SKILL.md and its folder, Creating Reanimated Animations needs the command-line tools its instructions call (npm and npx). Our summary lists: Node.js.

Does Creating Reanimated Animations access the network?

SKILL.md names 1 domain. As links in the text: github.com. This is read from the text; nothing was executed.

Is Creating Reanimated Animations safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Creating Reanimated Animations use?

No licence was found for Creating Reanimated Animations or its repository. Without one, default copyright applies: ask the author before reusing or redistributing it.

How many tokens does Creating Reanimated Animations use?

About 2.4k tokens (SKILL.md is roughly 9.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 15k tokens, read only when the agent opens those files.

What are the alternatives to Creating Reanimated Animations?

Skills that share tags, products or a category with Creating Reanimated Animations: React Native Testing (callstackincubator/agent-skills, 1.7k stars), React Native Testing (HoangNguyen0403/agent-skills-standard, 571 stars), Cometchat React Native Testing (cometchat/cometchat-skills, 131 stars) and Test Guidelines (getsentry/sentry-react-native, 1.8k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Creating Reanimated Animations?

gluestack (a GitHub organization) maintains it in gluestack/gluestack-ui, which has 5,323 GitHub stars. The repository holds 11 skills in this directory. The repository was last updated on September 2, 2026.

Source: gluestack/gluestack-ui on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.