← DOCS
fantasy

RunesReveal

Ancient runes that illuminate and reveal their translation.

npx chaos add runes-reveal

PREVIEW

ᚠᚢᚦ→ SECRET

USAGE

case 'glass-button': return ; case 'neon-glow': return ; case 'floating-button': return ;
import { RunesReveal } from '@oalacea/chaosui/text/runes-reveal';

<RunesReveal runes={['ᚠ', 'ᚢ', 'ᚦ']} translation="SECRET" />
<RunesReveal
  runes={['ᛟ', 'ᛃ', 'ᛇ']}
  translation="OPEN SESAME"
  runeStyle="nordic"
  revealSpeed="slow"
/>

PROPS

PropTypeDefault
runesThe runes to display (ancient symbols)
string[]-
translationThe translation text to reveal
string-
revealSpeedReveal animation speed
"slow" | "medium" | "fast""medium"
runeStyleRune style
"nordic" | "elven" | "draconic""nordic"
autoStartAuto-start animation on mount
booleantrue
startDelayDelay before start (ms)
number1000
onCompleteCallback when translation completes
() => void-