https://github.com/omnedia/ngx-word-morph
A simple component library to animate text.
https://github.com/omnedia/ngx-word-morph
Last synced: 11 days ago
JSON representation
A simple component library to animate text.
- Host: GitHub
- URL: https://github.com/omnedia/ngx-word-morph
- Owner: omnedia
- License: mit
- Created: 2024-07-16T07:20:58.000Z (9 months ago)
- Default Branch: master
- Last Pushed: 2024-12-12T01:41:02.000Z (5 months ago)
- Last Synced: 2025-04-15T02:44:40.751Z (11 days ago)
- Language: TypeScript
- Homepage:
- Size: 9.77 KB
- Stars: 4
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- trackawesomelist - ngx-word-morph (⭐4) - An Angular library designed to facilitate word morphing animations within Angular applications. (Recently Updated / [Oct 01, 2024](/content/2024/10/01/README.md))
- awesome-angular - ngx-word-morph - An Angular library designed to facilitate word morphing animations within Angular applications. (Table of contents / Third Party Components)
- fucking-awesome-angular - ngx-word-morph - An Angular library designed to facilitate word morphing animations within Angular applications. (Table of contents / Third Party Components)
README
# Ngx Word-Morph Component
This Library is part of the NGXUI ecosystem.
View all available components at https://ngxui.com
`@omnedia/ngx-word-morph` is an Angular library designed to facilitate word morphing animations within Angular applications.
## Features
- Morph words within your Angular application.
- Easily customizable.
## Installation
Install the library using npm:
```bash
npm install @omnedia/ngx-word-morph
```
## Usage
Import the `NgxWordMorphComponent` in your Angular module:
```typescript
import {NgxWordMorphComponent} from '@omnedia/ngx-word-morph';
@Component({
...
imports:
[
...
NgxWordMorphComponent,
],
...
})
```
Use the component in your template:
```html
```
## API
```html
```
Starts the word morphing effect.
- `words`: An array of strings to be animated.
- `morphDuration`: (optional): The duration of the morphing animation in milliseconds. Default is 1000.
- `morphDelay`: (optional): The delay between morphing one word to the next in milliseconds. Default is 5000.
- `styleClass`: (optional): Add a class to the `
` wrapper tag.
## Styling
If you want to style the text, do it globally via the `styleClass`.
To change the font size make sure to change the `--om-word-morph-font-size` variable instead of directly changing the size.
## Contributing
Contributions are welcome. Please submit a pull request or open an issue to discuss your ideas.
## License
This project is licensed under the MIT License.