# @masatomiyoshi/fade

> A javascript library for fade component

Latest version **1.0.3** (published 2026-08-11) · MIT license · 0 weekly downloads

## Install

```sh
npm install @masatomiyoshi/fade
pnpm add @masatomiyoshi/fade
yarn add @masatomiyoshi/fade
bun add @masatomiyoshi/fade
```

## Health

**Score 60/100 (C)** — status: active.

Positive: esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads; no types.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2026-08-11 |
| First published | 2022-06-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=22.13 |
| Dependencies | 1 |
| Unpacked size | 22.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Masato Miyoshi |
| Maintainers | masatomiyoshi |
| Keywords | fade, component |

## Links

- npm: https://www.npmjs.com/package/@masatomiyoshi/fade
- Repository: https://github.com/MasatoMiyoshi/fade
- Homepage: https://github.com/MasatoMiyoshi/fade#readme
- Issues: https://github.com/MasatoMiyoshi/fade/issues
- npm.io page: https://npm.io/package/@masatomiyoshi/fade

## Dependencies (1)

- [animejs](https://npm.io/package/animejs.md) ^4.2.2

## Recent versions

- 1.0.3 (latest) — 2026-08-11
- 1.0.2 — 2026-01-19
- 1.0.1 — 2024-07-30
- 1.0.0 — 2022-06-24

## README

# fade

A javascript library for fade component.

## Dependencies

- animejs

## Installation

Install from npm:

    $ npm install @masatomiyoshi/fade --save

## Usage

Import function:

```javascript
import { fadeIn, fadeOut } from '@masatomiyoshi/fade'
```

Build html as follows:

```html
<div class="fade-in__link"><a href="#">Fade in</a></div>
<div class="fade-out__link"><a href="#">Fade out</a></div>
<div class="content">
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
  </ul>
</div>
```

Build events:

```javascript
document.querySelector('.fade-in__link').addEventListener('click', () => {
  fadeIn(document.querySelector('.content'));
});
document.querySelector('.fade-out__link').addEventListener('click', () => {
  fadeOut(document.querySelector('.content'));
});
```

## License

The library is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

---
_Source: https://npm.io/package/@masatomiyoshi/fade · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._