Skip to content
search icon
clear
Component Status

Date Picker

Figma

How to add

  1. Locate the Assets tab in the Layers Panel.
  2. There are two ways to locate the Date picker component needed:
    • Use the search bar to search for a component grouping name or variation name.
    • Scroll through the folders list and open the grouping.
  3. Once the component needed is located, click and drag it into the frame/artboard.

How to use

  1. Select the Date picker in the frame/artboard.
  2. Locate and expand the highlighted layer in the Layers Panel.
  3. Edit the text ´Month YYYY´ to the right month and year.
  4. If needed, edit the numbers for the day components to fit with the days of the week.
  5. Change the state of the relevant day components to show today, hover and/or selected day(s), as well as disabled days for previous and future months.
  6. Edit the text in the active Text input field to show the correct selected date.
  7. Do not resize the Date picker.
Edit this page on GitHub