Drag and Drop Screen Builder

Element Panel

Heading

Subheading

Text

  • List Item 1
  • List Item 2
  • List Item 3

Canvas

Drag and drop from the element panel onto this canvas.
You can edit the words simply by clicking!

Title

Additional Settings

Code

<section id="generated_screen" class="w3-container screen">
  <div id="generated_screen_card" class="w3-card">
    <header class="w3-container w3-blue" id="generated_screen_header">
      <h1>Title</h1>
    </header>
    <div class="w3-container" id="generated_screen_content">
    </div>
    <footer class="w3-container w3-blue" id="generated_screen_footer">
      <p><a href="#" class="return_home">Go Home</a></p>
      <p><a href="#" class="logout">Logout</a></p>
    </footer>
  </div>
</section>