Rebuild the Matrix on your Svelte applications with this amazing effect

Try it on Codesandbox

# 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

The width of the Matrix canvas

default: window.innerWidth

<Matrix width={300} />

The height of the Matrix canvas

default: window.innerHeight

<Matrix height={150} />

Disables the initial column drop animation

default: false

<Matrix noInitialDrop />

Sets the font size of the Matrix characters

default: 16

<Matrix fontSize={24} />

Sets the font color of the Matrix characters

default: '#0f0'

<Matrix color='#fff' />

Sets the time interval of the fall speed of the characters

default: 33

<Matrix interval={33} />