Styled quick start

Copy this entrypoint first. It includes the imports required to get the component on screen.

svelte
<script lang="ts">
  import '@dryui/ui/themes/default.css';
  import '@dryui/ui/themes/dark.css';
  import { GodRays } from '@dryui/ui';
</script>

<GodRays>Content</GodRays>

Import options

Root package

ts
import { GodRays } from '@dryui/ui'

Per-component subpath

ts
import { GodRays } from '@dryui/ui/god-rays'

API

Props, CSS variables, and the public data attributes you can target when styling.

Prop Type Description Default Required Bindable
color
string
Semantic color or tone applied to the component. — — —
rayCount
number
— — — —
intensity
number
— — — —
center
{ x: number; y: number }
— — — —
speed
number
— — — —
blendMode
BlendMode
— — — —
children
Snippet
Content rendered inside the component. — — —