Embeddable Widgets

Free astrology widgets for your website

Add astrology content to your website with our free embeddable widgets. All widgets are free to use with attribution. Data is served via JSON API with CORS enabled, so you can integrate with any frontend.

Daily Horoscope Widget

Show daily horoscope for any zodiac sign. Content changes daily.

API Endpoint

GET https://celesian.com/api/widget/horoscope?sign=Aries

Parameters

signZodiac sign name (e.g., Aries, Taurus)
formatResponse format: json (default) or jsonp
callbackJSONP callback function name

Response Example

{
  "sign": "Aries",
  "date": "2026-02-25",
  "horoscope": "Your fire burns bright today. Today's focus: personal growth. Trust the process, even when progress feels slow.",
  "source": "celesian.com"
}
Embed Code

Copy and paste this into your HTML

<div id="celesian-horoscope"></div>
<script>
(function() {
  var sign = "Aries"; // Change to desired sign
  fetch("https://celesian.com/api/widget/horoscope?sign=" + sign)
    .then(function(r) { return r.json(); })
    .then(function(d) {
      var el = document.getElementById("celesian-horoscope");
      el.innerHTML = '<div style="padding:16px;border-radius:12px;background:#0a0a1a;color:#e5e7eb;font-family:system-ui;border:1px solid rgba(255,255,255,0.1)">'
        + '<div style="color:#c9a84c;font-weight:600;margin-bottom:8px">' + d.sign + ' Daily Horoscope</div>'
        + '<div style="font-size:14px;line-height:1.6">' + d.horoscope + '</div>'
        + '<div style="font-size:11px;color:#6b7280;margin-top:8px">Powered by <a href="https://celesian.com" style="color:#c9a84c;text-decoration:none">Celesian</a></div>'
        + '</div>';
    });
})();
</script>
Moon Phase Widget

Current moon phase with illumination percentage, phase name, and upcoming full/new moon dates.

API Endpoint

GET https://celesian.com/api/widget/moon

Parameters

dateSpecific date (YYYY-MM-DD), defaults to today
formatResponse format: json (default) or jsonp
callbackJSONP callback function name

Response Example

{
  "date": "2026-02-25",
  "phase": "Waning Crescent",
  "illumination": 12,
  "emoji": "🌘",
  "age": 26.45,
  "nextFull": "2026-03-11",
  "nextNew": "2026-02-28",
  "source": "celesian.com"
}
Embed Code

Copy and paste this into your HTML

<div id="celesian-moon"></div>
<script>
(function() {
  fetch("https://celesian.com/api/widget/moon")
    .then(function(r) { return r.json(); })
    .then(function(d) {
      var el = document.getElementById("celesian-moon");
      el.innerHTML = '<div style="padding:16px;border-radius:12px;background:#0a0a1a;color:#e5e7eb;font-family:system-ui;border:1px solid rgba(255,255,255,0.1);text-align:center">'
        + '<div style="font-size:48px">' + d.emoji + '</div>'
        + '<div style="color:#c9a84c;font-weight:600;margin:8px 0">' + d.phase + '</div>'
        + '<div style="font-size:14px;color:#9ca3af">' + d.illumination + '% illuminated</div>'
        + '<div style="font-size:12px;color:#6b7280;margin-top:8px">Next Full: ' + d.nextFull + ' | Next New: ' + d.nextNew + '</div>'
        + '<div style="font-size:11px;color:#6b7280;margin-top:8px">Powered by <a href="https://celesian.com" style="color:#c9a84c;text-decoration:none">Celesian</a></div>'
        + '</div>';
    });
})();
</script>
Usage Notes
  • +All widget APIs are free with no API key required
  • +CORS is enabled for all origins
  • +Responses are cached for 1 hour
  • +JSONP is supported for legacy sites (add format=jsonp&callback=myFunc)
  • +Please include a link back to celesian.com (already in the embed snippets)