Title: UI Components - Build With Roxy | RoxyAPI
Open Graph Title: UI Components - Build With Roxy | RoxyAPI
X Title: UI Components - Build With Roxy | RoxyAPI
Description: How to render astrology, vedic kundli, panchang, tarot, numerology, biorhythm, and I Ching with the open source UI component library. By RoxyAPI.
Open Graph Description: How to render astrology, vedic kundli, panchang, tarot, numerology, biorhythm, and I Ching with the open source UI component library. By RoxyAPI.
X Description: How to render astrology, vedic kundli, panchang, tarot, numerology, biorhythm, and I Ching with the open source UI component library. By RoxyAPI.
Opengraph URL: https://roxyapi.com/docs/ui
Domain: roxyapi.com
[{"@context":"https://schema.org","@type":"SoftwareApplication","@id":"https://roxyapi.com/#software-application","name":"RoxyAPI","applicationCategory":"DeveloperApplication","operatingSystem":"Web","description":"AI-native infrastructure powering the next generation of insight and prediction apps. Ship production-ready astrology (natal charts, horoscopes, synastry), Vedic astrology (kundli, panchang, KP, dasha), tarot, numerology, human design, forecast, dream interpretation, angel numbers, crystals, and I-Ching applications in days instead of months. 164+ endpoints across 12 intelligence domains with Remote Model Context Protocol (MCP) for seamless integration with OpenAI Agents, Gemini Agents, Claude Desktop, Cursor, Windsurf, and any MCP-compatible AI application. One subscription, one API key, instant activation. The intelligence layer for builders. You focus on experience, we handle the data.","url":"https://roxyapi.com","offers":{"@type":"AggregateOffer","lowPrice":"39","highPrice":"699","priceCurrency":"USD","offerCount":"4","priceSpecification":{"@type":"UnitPriceSpecification","price":"149","priceCurrency":"USD","unitText":"per month"}},"aggregateRating":{"@type":"AggregateRating","ratingValue":"4.5","ratingCount":127,"reviewCount":127,"bestRating":"5","worstRating":"1"},"author":{"@id":"https://roxyapi.com/#organization"},"provider":{"@id":"https://roxyapi.com/#organization"}},{"@context":"https://schema.org","@type":"Organization","@id":"https://roxyapi.com/#organization","name":"RoxyAPI","url":"https://roxyapi.com","logo":"https://roxyapi.com/logo.png","description":"AI-native infrastructure for astrology, Vedic astrology, tarot, numerology, human design, forecast, dreams, angel numbers, crystals, I-Ching, and biorhythm apps, with Remote MCP servers and AGENTS.md for AI agents","sameAs":["https://github.com/RoxyAPI","https://www.linkedin.com/company/roxyapi","https://www.wikidata.org/wiki/Q139552421","https://www.npmjs.com/org/roxyapi","https://pypi.org/org/Roxy/","https://packagist.org/packages/roxyapi/","https://profiles.wordpress.org/roxyapi/","https://wordpress.org/plugins/roxyapi/"],"foundingDate":"2024","founder":{"@type":"Person","@id":"https://abhishekchaudhary.com/#person","name":"Abhishek Chaudhary","alternateName":["Abhi","Abhishek Choudhary"],"jobTitle":"Founder","url":"https://abhishekchaudhary.com","sameAs":["https://www.wikidata.org/wiki/Q139547500","https://www.linkedin.com/in/aaychaudhary/","https://github.com/ph33nx","https://www.npmjs.com/~ph33nx"],"worksFor":{"@id":"https://roxyapi.com/#parent-organization"}},"parentOrganization":{"@type":"Organization","@id":"https://roxyapi.com/#parent-organization","name":"Roxy Labs","address":{"@type":"PostalAddress","addressLocality":"New Delhi","addressRegion":"Delhi","addressCountry":"India"},"founder":{"@id":"https://abhishekchaudhary.com/#person"}}},{"@context":"https://schema.org","@type":"WebSite","@id":"https://roxyapi.com/#website","name":"RoxyAPI","url":"https://roxyapi.com","publisher":{"@id":"https://roxyapi.com/#organization"},"potentialAction":{"@type":"SearchAction","target":"https://roxyapi.com/search?q={search_term_string}","query-input":"required name=search_term_string"}},{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Docs","item":"https://roxyapi.com/docs"},{"@type":"ListItem","position":2,"name":"Build With Roxy","item":"https://roxyapi.com/docs/ui"},{"@type":"ListItem","position":3,"name":"UI Components","item":"https://roxyapi.com/docs/ui"}]},{"@context":"https://schema.org","@type":"TechArticle","headline":"UI Components","description":"How to render astrology, vedic kundli, panchang, tarot, numerology, biorhythm, and I Ching with the open source UI component library. By RoxyAPI.","url":"https://roxyapi.com/docs/ui","articleSection":"Build With Roxy","author":{"@id":"https://roxyapi.com/#organization"},"publisher":{"@id":"https://roxyapi.com/#organization"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://roxyapi.com/docs/ui"},"inLanguage":"en-US","image":{"@type":"ImageObject","url":"https://roxyapi.com/og-image.png","width":{"@type":"QuantitativeValue","value":1200},"height":{"@type":"QuantitativeValue","value":630}}},{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"Is Roxy UI really free?","acceptedAnswer":{"@type":"Answer","text":"Yes. MIT licensed. Use it in commercial apps."}},{"@type":"Question","name":"Can I use it without the SDK?","acceptedAnswer":{"@type":"Answer","text":"Yes. Components are stateless. Fetch with `fetch`, axios, your favorite client, your own server proxy, anything. Pass the response as the `data` prop."}},{"@type":"Question","name":"Does it support React Native or Flutter?","acceptedAnswer":{"@type":"Answer","text":"Not yet. Web (browsers and webviews) only as of 2026."}},{"@type":"Question","name":"Will my brand colors work?","acceptedAnswer":{"@type":"Answer","text":"Yes. Override the `--roxy-*` CSS custom properties on `:root` or per element. The live preview has a Customize button that exports a CSS block."}},{"@type":"Question","name":"Do I need a separate UI/UX designer?","acceptedAnswer":{"@type":"Answer","text":"No. The components ship with sensible defaults out of the box. Theme to your brand colors and you are done."}},{"@type":"Question","name":"Can AI coding agents use this?","acceptedAnswer":{"@type":"Answer","text":"Yes. Cursor, Claude Code, GitHub Copilot, Codex, and any agent reading your `package.json` will see `@roxyapi/ui` and the standard component names. Path C drops typed wrapper files into your repo, which makes agent navigation even easier."}},{"@type":"Question","name":"How big is the bundle?","acceptedAnswer":{"@type":"Answer","text":"~85 KB gzipped for the full bundle from the CDN. ~9-21 KB per component when imported individually via the framework wrappers."}},{"@type":"Question","name":"Is there a TypeScript type for the response shape?","acceptedAnswer":{"@type":"Answer","text":"Yes. The SDK ships full types. The component `data` prop is typed against the matching endpoint response. Your IDE catches schema drift before runtime."}},{"@type":"Question","name":"What if my endpoint is not in the component list?","acceptedAnswer":{"@type":"Answer","text":"The catch-all `\u003croxy-data>` element renders any response shape as a structured table. New endpoints work out of the box; bespoke components ship as the catalog grows."}}]}]
| color-scheme | light dark |
| author | RoxyAPI Team |
| publisher | RoxyAPI |
| ai-summary | How to render astrology, vedic kundli, panchang, tarot, numerology, biorhythm, and I Ching with the open source UI component library. By RoxyAPI. |
| ai-key-facts | Why Roxy UI · Pick your path · Path A: Next.js (and any other framework with React) · Path B: Plain HTML (zero build step) · Path C: shadcn registry (Next.js + Tailwind) · What you can render · Theming · Wiring custom events |
| theme-color | #000000 |
| og:type | article |
| og:image | https://roxyapi.com/og-image.png |
| og:image:type | image/png |
| og:image:width | 1200 |
| og:image:height | 630 |
| og:image:alt | UI Components - Build With Roxy | RoxyAPI |
| twitter:card | summary_large_image |
| twitter:image | https://roxyapi.com/og-image.png |
Links:
Viewport: width=device-width, initial-scale=1.0
Robots: index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1