The Moon Phase element allows shoppers to personalize products by selecting a meaningful date—such as a birthday, anniversary, or special occasion—and displaying the corresponding moon phase from that night.

How It Works

When you add a Moon Phase to your design:

• Shoppers choose a date using a date picker.
• The moon image updates in real time to reflect the moon phase on that night.
• You can use the default moon images provided by Customily or upload your own.

In this article:

• How to add a Moon Phase
• Uploading your own Moon images
• Transform the Moon Phase

To add a Moon phase

You can add moon phases on Designs and Templates, by clicking the Moon Phase button.

Each moon phase you add will have a Name that you can edit, and a Unique Id for you to easily identify it. 

Using your own moon images

By default, moon phases will use Customily’s built-in moon image set, but you can upload your own if you'd like a custom style.

To use your own images:

1. Create an Image Library with 8 images—each representing one moon phase. You can learn how to create an Image Library here.
2. Make sure you upload the images on your library in this exact order:
   1. New Moon
   2. Waxing Crescent
   3. First Quarter
   4. Waxing Gibbous
   5. Full Moon
   6. Waning Gibbous
   7. Last Quarter
   8. Waning Crescent
      
3. On the design, select Pick Library and choose the Library you created.
   

Your Image Library will be applied to the Moon Phases, you can see how it looks by changing the date and browsing through all the moon phases.

Select the Moon Phase element, go to the Image Library section in the side panel, and choose your custom set.

Transform the moon phase

Directly on the canvas or by expanding the Transform toolbox, you can transform the moon phase's:

• Position
• Rotation
• Size
• Flip
• Order