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.