Skip to content

Circular (circular)

← Back to Object Elements | 📋 All Elements


This element is available in the Lucit Template Designer Elements Panel and can be added to any template by clicking on it.

When this element is added, the code listed in Element HTML will be added as a new layer in your template design that you can then customize as you see fit.

Overview

  • Type: object
  • Element Class: App\LuCore\DriveTemplates\BackgroundDriveTemplateElementClass

brown, repeating, tan, circles,

Preview

Element HTML

<div x-objectcode="circular" class="lc_ut_designer lc_dt_element lc_dt_object lc_dt_image_full_size_stretch" id="{id}" title="Circular" style=""></div>

Default CSS

--s: 70px; /* control the size */
  --c: #6B5344;

  --_l: #0000 46%,var(--c) 47% 53%,#0000 54%;
  background:
    radial-gradient(100% 100% at 100% 100%,var(--_l)) var(--s) var(--s),
    radial-gradient(100% 100% at 0    0   ,var(--_l)) var(--s) var(--s),
    radial-gradient(100% 100%,#0000 22%,var(--c) 23% 29%, #0000 30% 34%,var(--c) 35% 41%,#0000 42%)
    #F8ECC9;
  background-size: calc(var(--s)*2) calc(var(--s)*2);

← Back to Object Elements | 📋 All Elements