✨ Cosmic Glitter Astrology ✨

Your cosmic journey with nostalgic vibes ✧₊˚.⋆

★ Welcome to your cosmic journey! Generate your personal birth chart with extensive asteroid and celestial body tracking ★ Discover your rising sign, planetary placements, house meanings, and asteroid interpretations ★ Embrace your cosmic destiny ★ The stars have all the answers ★

✨ Birth Chart Generator ✨

Select Celestial Bodies to Include

Traditional Planets
Asteroids
Lilith Points
Dwarf Planets
Mythological
Sun
Moon
Mercury
Venus
Mars
Jupiter
Saturn
Uranus
Neptune
Pluto
North Node
South Node
Chiron
Ceres
Pallas
Juno
Vesta
Pholus
Nessus
Asbolus
Hylonome
Chariklo
Psyche
Eros
Sappho
Amor
Valentine
Dejanira
Diana
Toro
Hidalgo
Icarus
Pandora
Urania
Black Moon Lilith
Dark Moon Lilith
Asteroid Lilith
True Lilith
Eris
Quaoar
Sedna
Varuna
Orcus
Ixion
Makemake
Haumea
Sumeria
Ur
Babylon
Babel
Mesopotamia
Chaldaea
Gilgamesh
Adonis
Innanen
Ishtar
Semiramis
Kaali
Siva
Anubis
Isis
Osiris
Tara

✨ Calculating the celestial tapestry of your birth moment... ✨

Your Cosmic Birth Chart

Name:

Birth Date:

Birth Time:

Birth Place: ()

Chart Overview

Chart Ruler

Planet:

House:

Chart Balance

Elements

    Modalities

      Polarities

      Feminine (water/earth):

      Masculine (fire/air):

      Top Signs

        Bottom Signs

          Orientation

          Dominant Quadrant

          Dominant Hemisphere

          Planetary Distribution

          Top 3 Planets

            Bottom 3 Planets

              Planetary Placements

              House Placements

              Planetary Aspects

              Major Aspects

              Planets Aspect Orb Description

              Aspect Patterns

              Asteroid Placements

              Lilith Points

              Special Points & Mythological Bodies

              Color palette generator

              Select a color palette type:
              html { font-family: sans-serif; } body { margin: 0; } h1 { margin-left: 16px; } /* Basic form styling */ #color-picker { margin-left: 16px; margin-bottom: 20px; } #color-picker label, legend { display: block; font-size: 0.8rem; margin-bottom: 10px; } input[type="color"] { width: 200px; display: block; } fieldset { display: flex; gap: 20px; border: 0; } /* Palette container styling */ #container { /* Default value */ --base-color: red; display: flex; width: 100vw; height: 250px; box-sizing: border-box; } #container div { flex: 1; } /* Complementary colors */ /* Base color, and base color with hue channel +180 degrees */ .comp :nth-child(1) { background-color: var(--base-color); } .comp :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h + 180)); } /* Use @supports to add in support old syntax that requires deg units to be specified in hue calculations. This is required for Safari 16.4+. */ @supports (color: lch(from red l c calc(h + 180deg))) { .comp :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h + 180deg)); } } /* Triadic colors */ /* Base color, base color with hue channel -120 degrees, and base color */ /* with hue channel +120 degrees */ .triadic :nth-child(1) { background-color: var(--base-color); } .triadic :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h - 120)); } .triadic :nth-child(3) { background-color: lch(from var(--base-color) l c calc(h + 120)); } /* Use @supports to add in support old syntax that requires deg units to be specified in hue calculations. This is required for Safari 16.4+. */ @supports (color: lch(from red l c calc(h + 120deg))) { .triadic :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h - 120deg)); } .triadic :nth-child(3) { background-color: lch(from var(--base-color) l c calc(h + 120deg)); } } /* Tetradic colors */ /* Base color, and base color with hue channel +90, +180, and +270 degrees */ .tetradic :nth-child(1) { background-color: var(--base-color); } .tetradic :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h + 90)); } .tetradic :nth-child(3) { background-color: lch(from var(--base-color) l c calc(h + 180)); } .tetradic :nth-child(4) { background-color: lch(from var(--base-color) l c calc(h + 270)); } /* Use @supports to add in support old syntax that requires deg units to be specified in hue calculations. This is required for Safari 16.4+. */ @supports (color: lch(from red l c calc(h + 90deg))) { .tetradic :nth-child(2) { background-color: lch(from var(--base-color) l c calc(h + 90deg)); } .tetradic :nth-child(3) { background-color: lch(from var(--base-color) l c calc(h + 180deg)); } .tetradic :nth-child(4) { background-color: lch(from var(--base-color) l c calc(h + 270deg)); } } /* Monochrome colors */ /* Base color, and base color with lightness channel -20, -10, +10, and +20 */ .monochrome :nth-child(1) { background-color: lch(from var(--base-color) calc(l - 20) c h); } .monochrome :nth-child(2) { background-color: lch(from var(--base-color) calc(l - 10) c h); } .monochrome :nth-child(3) { background-color: var(--base-color); } .monochrome :nth-child(4) { background-color: lch(from var(--base-color) calc(l + 10) c h); } .monochrome :nth-child(5) { background-color: lch(from var(--base-color) calc(l + 20) c h); } /* Hide unused swatches for each palette type */ .comp :nth-child(2) ~ div, .triadic :nth-child(3) ~ div, .tetradic :nth-child(4) ~ div { display: none; } const form = document.forms[0]; const radios = form.elements["palette-type"]; const colorPicker = form.elements["color"]; const containerElem = document.getElementById("container"); for (const radio of radios) { radio.addEventListener("change", setContainer); } colorPicker.addEventListener("input", setBaseColor); function setContainer(e) { const palType = e.target.value; console.log("radio changed"); containerElem.setAttribute("class", palType); } function setBaseColor(e) { console.log("color changed"); containerElem.style.setProperty("--base-color", e.target.value); }