title: "@stnd/art" aliases: [] created: 2026-06-20 13:56 modified: 2026-07-05 19:22 last_audited: 2026-07-14 audit_interval_days: 90 next_audit: 2026-10-12 audit_priority: 3 maturity: seed mode: read publish: false status: active tags:

• package
• stnd theme: technical type: package visibility: private

@stnd/art

Generative identity-aware art components for the Standard Ecosystem.

ELI5

Same username in, same visual every time — a string like "alice" is hashed into a number, and that number seeds a deterministic PRNG (lib/seed.js) that every component in this package reads from. No two usernames look alike, but one username never changes look across sessions, devices, or components — an avatar and a button using the same seed feel like the same person’s stuff.

Use it:

<script>
  import { IdentityProvider, Avatar } from "@stnd/art";
</script>
<IdentityProvider username="alice">
  <Avatar size="4rem" />
</IdentityProvider>

Overview

@stnd/art provides a set of UI components that use generative art to create unique visual identities for users or entities. By using a seed (like a username), every component can share a consistent visual language.

Components (Svelte 5)

• IdentityProvider.svelte: Wraps other components to provide a shared identity context.
• Avatar.svelte: Seed-based generative avatars.
• ArtButton.svelte: Buttons with generative backgrounds.
• ArtInput.svelte: Input fields with generative accents.
• ArtTextarea.svelte: Text areas with generative borders.
• GenerativeArt.svelte: A raw component for rendering generative patterns (blobs, waves, geo, field).

Usage

<script>
  import { IdentityProvider, Avatar, ArtButton } from "@stnd/art";
</script>

<IdentityProvider username="alice">
  <Avatar size="4rem" />
  <ArtButton field="save">Save Changes</ArtButton>
</IdentityProvider>

Features

• Seed-Based: Consistent visuals derived from unique strings.
• Svelte 5 Runes: Built with the latest Svelte reactive primitives.
• Multiple Variants: Choose from different generative styles like “blobs”, “waves”, or “geometric”.

Notes / Observations

(jot down anything noticed here — quirks, gotchas, ideas)

Todo

• [ ] This is the generative-art atelier — the place to actually spend time [priority:: 3] [token_scale:: 3] [created:: 2026-07-14] [area:: framework] exploring (new variants beyond blobs/waves/geo/field, richer seed strategies, maybe pulling in the palette work from tonight’s utopie.studio session). The avatar use case works but hasn’t had much love yet — worth treating as a real creative project, not just a UI utility.