====== How To: Create a "Card" or "Icon" with Shadow Effect ======
  * Examples of the shadow effects to be created below:

^  Soft Card on Light Background\\ with a Soft Drop Shadow  ^  Button/Icon Soft Lift Contrasting Shadow\\ on Dark Background  ^  Icon/Button with a Soft Lift\\ Shadow for Light Background  ^  Icon/Button with a Hard Lift\\ Shadow for Light Background  ^
|  {{:ui:ui-resource-shape-shadow-card-r28_c1_80FFFFFF_c2_00000000-bkgd-soft_shadow_card-r32_x0_y10-80000000.webp?direct&200}}  |  {{:ui:ui-resource-shape-shadow-card_on_button-R22_X15_Y15_5AFFFFFF.webp?direct&100}}  |  {{:ui:ui-resource-shape-shadow-card_on_button-R32_X0_Y10_46000000.webp?direct&100}}  |  {{:ui:ui-resource-shape-shadow-button-R22_X15_Y15_80000000.webp?direct&100}}  |
==== Prerequisite: Background Layer Setup ====

  * A shadow effect requires a complex, colorful or polar background layer to be visible. Ensure the layer behind your shadowed objects— whether that is the system wallpaper, a page background image, or a background graphic object — is a colorful photograph or gradient, not a solid white or black color.\
  * The created shadows will be selected as the **Background** for the "button shape" or "icon image" used.

=== Phase 1: Create the Shadows ===

  * Create the **Shadow A**  (Soft Card Shadow for Light Background)
  - In Edit mode (pinch in) select ''Main menu'' > ''Launcher Options'' > ''Resources'' > ''Shadow''
  - Tap the "Add" icon
  - For "Label" enter ''Soft_Card_Shadow_Light_Bkgd''
    - "Shadow color": Tap the box area and select "Color". For ARGB enter ''80000000'' (Black with ~25% opacity)
    - The "color box" for "OK" will change. Tap it to return to the "Shadow Add" dialog.
    - For "Shadow radius" enter ''32''
    - For "Offset X" enter ''0''
    - For "Offset Y" enter ''10''
  - Tap OK to return to the Shadow dialog

  * Create the **Shadow B** (Button Soft Lift for Dark Background)
  - Tap the "Add" icon
  - For "Label" enter ''Button_Lift_Shadow_dark_bkgd''
  - "Shadow color": Tap the box area and select "Color". For ARGB enter ''5AFFFFFF'' (Black with ~35% opacity)
  - The "color box" for "OK" will change. Tap it to return to the "Shadow Add" dialog.
  - For "Shadow radius" enter ''22''
  - For "Offset X" enter ''15''
  - For "Offset Y" enter ''15''
  - Tap OK to return to the Resource dialog

  * Create the **Shadow C** (Button Hard Lift for Light Background). Note: This is duplicates the previous shadow, but the //shadow color// changes to contrast with the destination background to provide the offset.
  - Tap the "Add" icon
  - For "Label" enter ''Button_Lift_Shadow_light_bkgd''
  - "Shadow color": Tap the box area and select "Color". For ARGB enter ''80000000'' (Black with ~35% opacity)
  - The "color box" for "OK" will change. Tap it to return to the "Shadow Add" dialog.
  - For "Shadow radius" enter ''22''
  - For "Offset X" enter ''15''
  - For "Offset Y" enter ''15''
  - Tap OK to return to the Resource dialog
=== Phase 2: Create the Shapes ===

  * Create the Card Shape (used for main panels and widgets)
  - Back out to the Resources dialog and select ''Shape''
  - Tap the ''Add'' icon
  - For "Shape" select ''Round rectangle''
  - Tap its Option icon and for its radius set ''28''
  - "Color1": Tap the icon, select "Color"
  - For ARGB enter ''3CFFFFFF'' (Note: The 1st 2 digits represent Alpha. 3C is ~60% opacity for a frosted look)
  - Tap OK
  - "Border width" set at ''1'', do //not// tap OK yet
  - "Border color": tap and select "Color" and for ARGB enter ''26FFFFFF''
  - Label: enter ''Shadow_Card'' and tap OK to return to the Shape dialog

  * Create the Button Shape (used for icons and taps)
  - Still in the Shape dialog, tap the ''Add'' icon
  - For "Shape" select ''Round rectangle''
  - Tap its Option icon and for its radius set ''20''
  - "Color1": Tap the icon, select "Color"
  - For ARGB enter ''50FFFFFF'' (represents Alpha of ~80% for a slightly more solid button)
  - The "color box" for "OK" will change. Tap it to return to the "Shadow Add" dialog.
  - "Border width" will remain at ''0'' (not used)
  - Label: enter ''Shadow_Button'' and tap OK to return to the main menu

=== Phase 3: Apply the Resources to Objects ===

  * Apply to a "floating" app icon
  - In Edit On mode tap the ''Add'' icon in the Page Design Menu
  - Select ''Graphic'' > ''Image''  > ''Default'' > ''Icon packs''
  - Scroll or use the search dialog to select the desired icon. Tap to select it.
  - The App icon is on the page and selected. In the Object Design menu tap the "Option" icon
  - In the main Option Edit dialog, tap "Background" > select <<"Shape">> > ''Shadow_Button''
  - In the main Option Edit dialog (do NOT tap Background again), scroll to find "Shadow" > select ''Button_Lift_Shadow''
  - Tap "Margins" and set to ''14'' for all 4 sides. Tap OK.

  * Create a visual "Shadow Card" panel on the page
  - In Edit On mode tap the ''Add'' icon in the Page Design Menu
  - Select ''Graphic'' > ''Shape''
  - The default shape is placed on the page. In the Object Design menu tap the "Option" icon
  - In the main Option Edit dialog, tap "Shape" > select ''Glass_Card''
  - In the main Option Edit dialog, scroll to find "Shadow" > select ''Soft_Card_Shadow''
  - Tap OK.
  - Resize this panel to your desired dimensions.
  - Note: Ensure this panel is layered behind your icons by tapping its option menu and selecting "Send to back".