# argyleink/transition.css

:octocat: Drop-in CSS transitions

Repository: https://github.com/argyleink/transition.css
Canonical: https://ross.abutalabs.com/products/transitioncss
Homepage: https://transition.style
Language: CSS
License: Apache-2.0
License Family: permissive
Topics: css, transitions, animations, keyframes, clip-path, masking, hackpack
Last push: 2025-06-16T20:08:23+00:00

## Health v2 (maintenance only)
Score: 35/100 (v2, computed 2026-09-03T02:20:16.233290+00:00)
- activity 27, release rhythm 8, longevity 100
- inputs: {"age_days": 2227, "days_push": 443, "days_rel": 443, "gap_med": null, "n_releases_24m": 1}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 2025, forks 129 (observed 2026-08-28T04:06:06.774100+00:00)

## What it is
A drop-in CSS library providing 46 pre-built clip-path based transitions and animations via simple HTML attributes. It ships as a single stylesheet import with category bundles and a customizable 'Hackpack' of CSS custom properties.

## Use cases
- add page wipe transitions to a website
- animate elements entering with circle or polygon reveals
- drop-in css transitions without writing keyframes
- try transitions on any existing site via bookmarklet
- compose custom clip-path transitions with css variables

## When to choose
- you want polished transitions with zero JavaScript
- you need quick drop-in animations via an HTML attribute
- you want to customize transitions using CSS custom properties

## When to avoid
- you need complex JS-driven or scroll-linked animation orchestration
- you require framework-specific animation APIs like React Transition Group
- you need physics-based or spring animations

## Facets
- artifact type: library
- maturity: stable
- function: animation, css-framework, ui-components
- domain: web-development, frontend, web-design
- platform: browser, cross-platform
- tags: css-transitions, clip-path, keyframes, drop-in, no-javascript

## Member repositories
- argyleink/transition.css (main) score 35

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:06:06.774100+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-30T02:59:45.379851+00:00, confidence not recorded.
  - readme: https://github.com/argyleink/transition.css (fetched 2026-08-28T04:06:06.774100+00:00, sha 6c8e8607c488)
  - homepage: https://transition.style (fetched 2026-08-29T10:39:51.313061+00:00, sha 8161233e0c29)
- Data as of 2026-08-30T08:39:29.467469+00:00.
