This HTML page and javascript draw an svg picture of the moon that tries to match the current actual phase of the moon. Also uses unicode emoji moons in the <title> element. A new svg will be calculated every day; but there are only 8 emoji moons.

"A little while ago the task of calculating lunar phases came to mind. After investigating the various algorithms out there, I collected together this little bunch, (mainly wrapped inside complete 'show all the phases for a year' programs), and hacked them about a bit to work nicely with Javascript . They are presented here for your edification, delight and ripping off."

This javascript was modified into a function that returns a number between 0 and 1 representing how far through the lunar cycle we are. 0 and 1 are both new moons, 0.5 is the full moon.

This is a translation of a set of routines from Montenbruck and Pfleger's Astonomy on the Computer 2nd english ed - see chapter 3.8 the sunset progrm

© StarFields [1] 1998 - 2012. All Rights Reserved. You are very welcome to use my background images on your website or blog free of charge. All other uses, please contact StarFields [2] for permission.

<svg width="98%" height="98%" xmlns="http://www.w3.org/2000/svg" version="1.1">
      <svg id="moon" viewBox="0 0 200 200">
            <!-- black background of moon is path class="moonback" -->
            <path class="moonback" d="m100,0 a20,20 0 1,1 0,150 a20,20 0 1,1 0,-150"></path>
            <path class="moon" d="m100,0 a0.40078440694886197,20 0 1,1 0,150 a20,20 0 1,1 0,-150"></path>
            <!--                             ^                       ^                  ^
               this cycles between 0 and 20 -+                       |                  |
                            4 times a month                          +------------------+
                                                                     |
                                                                     these arc-sweep options cycle
                                                                     1,0 --  0,0 --  1,1 -- 0,0 
            -->
      </svg>
</svg>