Transition.css

Transition.css is a CSS animation library and declarative UI animation framework that provides pre-built entry and exit animations triggered directly by HTML attributes without requiring custom JavaScript. It functions as a CSS transition toolkit, supplying customizable animation sequences and geometry primitives designed for rapid web interface prototyping.

The library enables users to apply page and element transitions, trigger pre-built visual effects, and compose custom transitions by combining raw keyframes with custom state properties. Animation timing, delays, pacing curves, and transition styles can be customized globally or per element using standard CSS custom properties.

Additional utilities include a browser bookmarklet that allows developers to inject the animation stylesheet into arbitrary live web pages to test visual effects interactively.

Features

CSS Animation Utilities - Provides pre-built entry and exit animations driven by declarative HTML attributes without JavaScript.
Declarative Element Animators - Animates HTML elements by interpolating between declarative start and end states triggered by attributes.
Declarative Animation Frameworks - Applies visual transition effects and timing variables to web elements declaratively.
CSS Toolkits - Supplies customizable animation sequences and geometry primitives designed for rapid web prototyping.
CSS Styling - Adds lightweight CSS transition effects to website elements using simple HTML attributes.
Custom Keyframe Sequences - Supports injecting unique keyframe definitions to build bespoke animation sequences.
Page Transition Animations - Provides visual effects to swap content between pages smoothly.
Visual Style Customization - Enables overriding default variables and applying visual configurations to tailor transition styles.

سجل النجوم

argyleinktransition.css

Name: argyleink/transition.css
Author: argyleink

View on GitHub

2,020 نجوم127 تفرعاتCSSApache-2.011 مشاهداتtransition.style

Transition.css

Additional utilities include a browser bookmarklet that allows developers to inject the animation stylesheet into arbitrary live web pages to test visual effects interactively.

Features

CSS Animation Utilities - Provides pre-built entry and exit animations driven by declarative HTML attributes without JavaScript.
Declarative Element Animators - Animates HTML elements by interpolating between declarative start and end states triggered by attributes.
Declarative Animation Frameworks - Applies visual transition effects and timing variables to web elements declaratively.
CSS Toolkits - Supplies customizable animation sequences and geometry primitives designed for rapid web prototyping.
CSS Styling - Adds lightweight CSS transition effects to website elements using simple HTML attributes.
Custom Keyframe Sequences - Supports injecting unique keyframe definitions to build bespoke animation sequences.
Page Transition Animations - Provides visual effects to swap content between pages smoothly.
Visual Style Customization - Enables overriding default variables and applying visual configurations to tailor transition styles.

بدائل مفتوحة المصدر لـ Transition.css

مشاريع مفتوحة المصدر مشابهة، مرتبة حسب عدد الميزات المشتركة مع Transition.css.

nitin42/animate-components
nitin42/animate-components
907عرض على GitHub
Animate Components is a motion framework that provides a collection of declarative primitives for managing visual transitions and animation sequences within web applications. It functions as a component-based library designed to standardize motion behavior, ensuring that interface elements move and transition consistently across different parts of a project. The library distinguishes itself through a framework-neutral architecture that bridges animation logic with various component models. By utilizing a declarative interface, it allows developers to compose complex motion patterns and synchr
JavaScriptanimate-componentsanimationscreate-react-app
عرض على GitHub907
plus1tv/react-anime
plus1tv/react-anime
1,563عرض على GitHub
React-anime is a declarative motion framework designed to integrate animation capabilities into component-based user interfaces. It functions as a library for animating CSS, SVG, and DOM properties by mapping component properties directly to animation states, allowing developers to define motion through a component-based architecture. The library distinguishes itself through its ability to manage hierarchical animation sequences and automated lifecycle transitions. It provides tools to orchestrate complex, nested motion effects and handles the entrance and exit of elements as they are added t
TypeScriptanimationanimedynamic
عرض على GitHub1,563
unocss/unocss
unocss/unocss
18,854عرض على GitHub
UnoCSS is an atomic CSS engine and utility-first framework that generates styles on-demand based on the specific classes used in your source code. By scanning your project files during the build process, it produces only the CSS necessary for your application, effectively minimizing bundle size and eliminating unused styles. The engine distinguishes itself through a highly modular, configuration-driven architecture that allows for deep customization of design tokens, rules, and presets. It supports advanced styling patterns such as attribute-based styling, tag-based styling, and dynamic varia
TypeScriptatomic-cssengineunocss
عرض على GitHub18,854
beekai-oss/react-simple-animate
beekai-oss/react-simple-animate
1,820عرض على GitHub
React-simple-animate is a declarative motion framework designed for building CSS keyframe animations and style transitions within web interfaces. It functions as a utility for orchestrating complex, multi-step visual effects by defining style sequences, timing, and easing properties directly within component logic. The library distinguishes itself through its focus on sequencing and coordination, allowing developers to chain multiple animation instances or group them to execute in specific orders. By utilizing functional hooks and declarative properties, it manages animation lifecycles and st
TypeScriptanimateanimate-cssanimation
عرض على GitHub1,820

عرض جميع البدائل الـ 30 لـ Transition.css

مجموعات مختارة تضم Transition.css

مجموعات منسقة بعناية يظهر فيها Transition.css.

الأسئلة الشائعة

ما هي وظيفة argyleink/transition.css؟

ما هي الميزات الرئيسية لـ argyleink/transition.css؟

الميزات الرئيسية لـ argyleink/transition.css هي: CSS Animation Utilities, Declarative Element Animators, Declarative Animation Frameworks, CSS Toolkits, CSS Styling, Custom Keyframe Sequences, Page Transition Animations, Visual Style Customization.

ما هي البدائل مفتوحة المصدر لـ argyleink/transition.css؟

تشمل البدائل مفتوحة المصدر لـ argyleink/transition.css: nitin42/animate-components — Animate Components is a motion framework that provides a collection of declarative primitives for managing visual… plus1tv/react-anime — React-anime is a declarative motion framework designed to integrate animation capabilities into component-based user… unocss/unocss — UnoCSS is an atomic CSS engine and utility-first framework that generates styles on-demand based on the specific… beekai-oss/react-simple-animate — React-simple-animate is a declarative motion framework designed for building CSS keyframe animations and style… awesome-reveal/react-awesome-reveal — This library provides a collection of component-based wrappers designed to automate element entrance animations within… rombohq/tailwindcss-motion — This project is a Tailwind CSS animation library and accessibility-aware motion framework. It provides a collection of…