Synaptic SkillsSynapticSkills
MarketplaceSkill GraphCriar SkillMCP ServerPlataformaEnterprise
v0.1.0-beta
Voltar ao Marketplace
ContentMédio

Svg Animations

porsupermemoryai·supermemoryai· v1.0.0 · atualizado em 2026-04-11
80
Score

Create beautiful, performant SVG animations and illustrations. Use this skill when the user asks to create SVG graphics, icons, illustrations, animated logos, path animations, morphing shapes, loading spinners, or any animated SVG content. Covers SMIL animations, CSS-driven SVG animation, path drawing effects, shape morphing, motion paths, gradients, masks, and filters.

svganimationgraphicsweb-designfrontendillustration
Linguagens
HTMLCSS
0Stars
0Forks
0Usos
Fork

Documento do Skill

SKILL.mdsvg-animations/workflow
1. Define the SVG canvas using the `viewBox` attribute to establish the coordinate system.
2. Create basic shapes (rectangles, circles, lines, polygons) or complex paths using the `<path>` element and its `d` attribute.
3. Apply gradients, masks, and filters to enhance visual appeal and create special effects.
4. Choose between CSS animations and SMIL animations based on the desired level of control and compatibility.
5. Implement animation logic using CSS keyframes or SMIL elements (`<animate>`, `<animateTransform>`, `<animateMotion>`).
6. Fine-tune timing, easing, and synchronization to achieve the desired animation flow.
7. Test the animation in different browsers and devices to ensure consistent performance and appearance.

Telemetria de Agentes

Execuções
0
total
Taxa de Sucesso
0%
últimos 30d
Latência Média
0.0s
p50
Alucinação
0.0%
detecção
Tokens Entrada
0
avg 0/exec
Tokens Saída
0
avg 0/exec

Uso por Plataforma

Skills Relacionados

Similar aReveal.js Presentations
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
82
Similar aDesign With Taste
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
84
Similar a ←Imagen - AI Image Generation Skill
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
78
Similar a ←Frontend Design Ultimate
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79
Similar a ←Color Expert
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
78
Similar a ←OilOil UI/UX Guide (Modern Minimal)
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Mobile App UI/UX Design
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
85
Similar a ←Rams Design Review
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
78
Similar a ←Landing Page Builder
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Dark Mode Design
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
81
Similar a ←macOS App Design & Development
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
83
Similar a ←Suggest Lucide Icons
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79
Similar a ←Appstore Screenshots ASO
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
82
Similar a ←Photoshop Automator Skill
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
77
Similar a ←SVG Illustration Entry
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
76
Similar a ←PromptSlide
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79

Árvore do Skill

Svg Animations
svg-animations
Fases Cognitivas5
1.SENSE
2.CONTEXTUALIZE
3.HYPOTHESIZE
4.RECOMMEND
5.ACT
Triggers8
create an animated SVGgenerate an SVG animationmake an SVG graphicanimate an SVG logocreate a path animation in SVGmorph shapes in SVGcreate a loading spinner with SVGdesign an animated SVG icon

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%
🤖Sucesso de Agentes0%
🕐Atualidade100%
🔗Saúde de Dependências100%
🕸️Centralidade no Grafo0%
🛡️Segurança50%
CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download svg-animations
$ synaptic skills detail svg-animations
$ synaptic skills live svg-animations

Links

GitHub Repository