@moefy-canvas/theme-meteor
v0.5.2
Published
<p align="center"> <img alt="type" src="https://img.shields.io/static/v1?label=type&message=cursor-effects&color=green&style=for-the-badge" /> <a href="https://www.npmjs.com/package/@moefy-canvas/theme-meteor" target="_blank"><img alt="npm" src="htt
Downloads
5
Maintainers
Readme
@moefy-canvas/theme-meteor
:stars: 晃动下鼠标~
Install
pnpm add @moefy-canvas/theme-meteor
Usage
<canvas id="moefy-canvas"></canvas>
import {
Meteor,
type MeteorConfig,
type CanvasOptions,
MAX_Z_INDEX,
} from '@moefy-canvas/theme-meteor'
const themeConfig: MeteorConfig = {
numParticles: null,
particleColor: {
light: 'rgba(102, 175, 239, .2)',
dark: 'rgba(245, 236, 66, .2)',
},
}
const canvasOptions: CanvasOptions = {
opacity: 1,
zIndex: MAX_Z_INDEX,
}
const el = document.getElementById('moefy-canvas')
const meteor = new Meteor(themeConfig, canvasOptions)
meteor.mount(el as HTMLCanvasElement)
ThemeConfig
export interface ColorTheme {
light: string
dark: string
}
export interface MeteorConfig extends ThemeConfig {
numParticles?: number | null
particleColor?: string | ColorTheme
}