You might want the moon today widget on your website

Moon Phases API (with pictures svg)

Function load_moon_phases

Use this function together with the code of the examples you want. Investigate later if you want.
This function (AJAX) gets the 'moon' object and sends it to the user-defined 'callback' function.

Output preferences are passed to the load_moon_phases function with an object.

Values that are accepted are marked in green.
var configMoon = { lang : 'en', // (*) month : new Date().getMonth() + 1, // 1 - 12 year : new Date().getFullYear(), // year size : 100, // "100%" - pixels lightColor : "#FFFF88", //CSS color shadeColor : "black", // CSS color texturize : false, // true - false }
(*) Languages available output API: en English ; es Español ; fr Française ; zh 中国 ; ru русский ; ca Català ; it Italiano ; pt Português ; de Deutsch ; pl Polski ;

Example 1 - The Moon today.

Example 2 - Maximum phases of the month

See (edit) the example in Codepen.

Example 3 - The moon of the whole month.

See (edit) the example in Codepen.

Example 4 - Mark the moon phases on your calendar as a background image.

See (edit) the example in Codepen.
Warning: You can manipulate whatever you want except the link to the lunar calendar month.