Rebuild the Matrix on your Svelte applications with this amazing effect
# yarn
yarn add -D svelte-matrix
# npm
npm i -D svelte-matrix
<script>
import Matrix from 'svelte-matrix'
</script>
<Matrix />
You can control the behavior of the matrix effect by passing specific props to the <Matrix />
component
width
The width of the Matrix canvas
default: window.innerWidth
<Matrix width={300} />
height
The height of the Matrix canvas
default: window.innerHeight
<Matrix height={150} />
noInitialDrop
Disables the initial column drop animation
default: false
<Matrix noInitialDrop />
fontSize
Sets the font size of the Matrix characters
default: 16
<Matrix fontSize={24} />
color
Sets the font color of the Matrix characters
default: '#0f0'
<Matrix color='#fff' />
interval
Sets the time interval of the fall speed of the characters
default: 33
<Matrix interval={33} />