// sdk · Web Components
AstroWay web components (alpha)
Natal wheel, moon phase, compatibility, tarot and horoscope as plain HTML elements for any site: one <script> tag from a CDN, or npm install. Charts are drawn by the same code as the API, so a wheel on your page matches what /v1/render returns. Alpha: attribute names may still change before 1.0.
// 01 / install
Install
npm install @astroway/ui@alpha pnpm
pnpm add @astroway/ui yarn
yarn add @astroway/ui CDN
<script type="module" src="https://cdn.jsdelivr.net/npm/@astroway/ui/dist/cdn/index.js"></script> import: import '@astroway/ui';
View on registry → @astroway/ui
// 02 / highlights
Highlights
- Plain custom elements: HTML, WordPress, Vue, Svelte, React 19, Next.js
- The same SVG as /v1/render
- No key for public data
- A pk_ key with origins, a cap and a scope
- 21 languages from the API responses
// 03 / first request
Make your first request
<script type="module" src="https://cdn.jsdelivr.net/npm/@astroway/ui/dist/cdn/index.js"></script>
<!-- keyless: the moon phase in the visitor's language -->
<aw-moon-phase lang="uk"></aw-moon-phase>
<!-- a publishable pk_ key bound to your domain, credit cap and endpoint list -->
<aw-natal-wheel api-key="pk_live_..." date="1990-07-14" time="14:30"
latitude="50.45" longitude="30.52" timezone-offset="3"></aw-natal-wheel>Start building with Web Components
10,000 credits free per month. Open-source SDK, generated from OpenAPI 3.1, always in sync with the backend.