Add GemFYI entity cards, comparison tables, glossary terms, interactive tools, and inline elements to any website with a single line of HTML. No build tools. No dependencies. Live data from the GemFYI database.
Entity Card Preview
Two lines of HTML. That's all it takes.
Select a widget type to preview. Every widget includes Shadow DOM isolation and a "Powered by GemFYI" backlink.
Widget preview loads from live API
Widget preview loads from live API
Configure widgets with data-* attributes.
| Attribute | Values | Default | Description |
|---|---|---|---|
| data-gemfyi | entity, compare, glossary, guide, search, [tools] | required | Widget type to render |
| data-slug | any slug | — | Entity slug from the GemFYI database |
| data-theme | light, dark, sepia, auto | light | Visual theme (auto follows OS preference) |
| data-style | modern, technical | modern | Widget design style |
| data-size | default, compact, large | default | Widget size |
| data-slugs | slug-a,slug-b | — | Comma-separated slugs for compare widget |
| data-placeholder | any string | Search... | Search box placeholder text |
2 design styles × 4 themes. Mix and match to fit your site.
Clean lines, rounded corners, accent gradients. Ideal for product pages and marketing sites. Default style.
Monospace typography, grid overlays, laboratory aesthetic. Ideal for scientific documentation and research papers.
Set explicitly or use auto to follow the visitor's OS preference (prefers-color-scheme).
Warm paper-tone background. Perfect for science blogs, journal articles, and educational content.
Multiple delivery options to fit your workflow.
Global CDN, auto-updates with npm. Recommended for most use cases.
<script src="https://cdn.jsdelivr.net/npm/gemfyi-embed@1/dist/embed.min.js"></script>
For Webpack, Vite, Rollup bundlers.
npm install gemfyi-embed // In your JS/TS: import 'gemfyi-embed';
Lock to a specific version for production stability.
<script src="https://cdn.jsdelivr.net/npm/gemfyi-embed@1.0.0/dist/embed.min.js"></script>
Part of FYIPedia — open-source developer tools for chemistry, geology, astronomy, and materials science. Hub: labfyi.com.
| Site | Domain | Package |
|---|---|---|
| ChemFYI | chemfyi.com | npm |
| AlloyFYI | alloyfyi.com | npm |
| GemFYI | gemfyi.com | npm |
| StarFYI | starfyi.com | npm |
| MineralFYI | mineralfyi.com | npm |