Skip to content
Esc
↑↓navigate↵open⌘Jpreview

← All examples

Tap

Source code

<script lang="ts">
	import { mercury,type AnimationInstance  } from '@omicrxn/mercury';
	let animation = $state<AnimationInstance>();
</script>

<div class="flex flex-col gap-4">
	<div
		class="box w-16 h-16 bg-blue-200 rounded-md border border-slate-500"
		style="transform: scale(0.4);"
		{@attach mercury({
			animate: { scale: 1 },
			whileTap: {
			scale: 0.5 , transition: { duration: 0.5, type: 'spring' } },
			transition: { ease: 'circInOut', duration: 1 }
		})}
	></div>
</div>