Hidamari Text

A text component with warm, animated gradient colors inspired by sunlight filtering through leaves.

Installation

npm install fuyukaki-ui

Usage

import { HidamariText } from 'fuyukaki-ui'

function App() {
  return <HidamariText>Hello, World!</HidamariText>
}

Examples

Default

Warm Sunlight Text

Custom Colors

You can customize the gradient colors by passing an array of color values.

Custom warm colors

Persimmon Gradient

Leaf green theme

Forest Colors

<HidamariText colors={['#EB6101', '#F5A623', '#FFD93D']}>
  Persimmon Gradient
</HidamariText>

Animation Speed

Control the animation speed with the speed prop (in seconds).

Slow (5s)

Slow Animation

Fast (1s)

Fast Animation

<HidamariText speed={5}>Slow Animation</HidamariText>
<HidamariText speed={1}>Fast Animation</HidamariText>

Props

PropTypeDefault
childrenReact.ReactNode-
colorsstring[]warm gradient
speednumber3