# jolaleye/cssfx

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/jolaleye-cssfx).**

6,129 stars · 349 forks · Vue · MIT · archived

## Links

- GitHub: https://github.com/jolaleye/cssfx
- Homepage: https://cssfx.netlify.com
- awesome-repositories: https://awesome-repositories.com/repository/jolaleye-cssfx.md

## Topics

`animation` `css` `design` `svg` `vue`

## Description

CSSFX is a curated collection of pre-made visual CSS effects for buttons, inputs, and other common UI elements. The library is entirely CSS-only, meaning the effects themselves require no JavaScript runtime, and each style can be copied to the system clipboard with a single click using the modern Clipboard API.

The project is built as a single-page application with a component-based architecture, yet it delivers its entire interface without external JavaScript frameworks. All effect previews and code snippets are pre-rendered into static HTML files at build time, so each page request requires no server-side processing. The frontend remains minimal and zero-dependency, handling only client-side routing and clipboard interactions.

## Tags

### User Interface & Experience

- [Libraries](https://awesome-repositories.com/f/user-interface-experience/css-hover-effect-libraries/libraries.md) — Provides a curated collection of pre-made visual CSS effects for buttons, inputs, and other UI elements.
- [CSS Visual Effect Galleries](https://awesome-repositories.com/f/user-interface-experience/css-visual-effect-galleries.md) — Provides a curated collection of pre-made visual CSS effects for UI elements.

### Development Tools & Productivity

- [Clipboard Copying](https://awesome-repositories.com/f/development-tools-productivity/clipboard-management/clipboard-copying.md) — Copies pre-made visual CSS styles to the clipboard with a single click. ([source](https://cdn.jsdelivr.net/gh/jolaleye/cssfx@master/README.md))

### Programming Languages & Runtimes

- [Effect Libraries](https://awesome-repositories.com/f/programming-languages-runtimes/pure-javascript-implementations/css-only-interactive-effects/effect-libraries.md) — Ships a curated collection of pre-made visual CSS effects for buttons and inputs.