<turbo-stream action="append" targets="body"><template><dialog id="editor-new-design-modal" class="dialog-modal ez-modal ez-modal--centered" data-action="mousedown-&gt;editor-new-design#close close-dialog-&gt;editor-new-design#close" data-controller="editor-new-design" data-editor-new-design-open-on-connect-value="true">

  <!-- need tabindex="0" so links further down don't get autofocused when the dialog is opened -->
  <div class="ez-modal__inner-wrap" tabindex="0">
    <div class="ez-modal__modal ">
      <div class="ez-close-btn group cursor-pointer flex items-center justify-center h-2 w-2 z-99 whitespace-nowrap absolute overflow-hidden indent-[100%]" title="Close" data-action="click-&gt;editor-new-design#close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12.99 12.99" role="img" class="ez-close-btn__icon h-full w-full pointer-events-none fill-grey-300 group-hover:fill-grey-600 group-active:fill-grey-900"><path d="M12.99 1.42 11.57 0 6.49 5.07 1.42 0 0 1.42l5.07 5.07L0 11.57l1.42 1.42 5.07-5.07 5.08 5.07 1.42-1.42-5.07-5.08 5.07-5.07z"></path></svg>
</div>


      <div class="ez-modal__content" data-dialog-modal-target="content">
        <div data-editor-new-design-target="content"
     data-ez-modal-target="content"
     class="editor-new-design-modal__wrapper">

  <div class="editor-new-design-modal__left">
    <h2 class="editor-new-design-modal__header__left">
      Artboard Size
    </h2>

  <div class="editor-new-design-modal__categories">
    <ul class="editor-new-design-modal__categories__list">
          <li class="editor-new-design-modal__list__item editor-new-design-modal__list__item_active" id="template-category-100" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1080" data-category-height="1080" data-category-id="100">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/100/instagram-post.png" alt="Instagram Post" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Instagram Post
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1080 x 1080 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-298" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1050" data-category-height="600" data-category-id="298">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/298/business-card-h.png" alt="Business Cards (Landscape)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Business Cards (Landscape)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1050 x 600 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-628" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="2550" data-category-height="3300" data-category-id="628">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/628/Thumbnail__-_invoice.png" alt="Invoices" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Invoices
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              2550 x 3300 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-265" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="2000" data-category-height="1545" data-category-id="265">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/265/certificate.png" alt="Certificate (Landscape)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Certificate (Landscape)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              2000 x 1545 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-331" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="600" data-category-height="1050" data-category-id="331">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/331/business-card-v.png" alt="Business Cards (Portrait)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Business Cards (Portrait)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              600 x 1050 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-166" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1000" data-category-height="1500" data-category-id="166">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/166/pinterest-graphic.png" alt="Pinterest Graphic" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Pinterest Graphic
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1000 x 1500 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-364" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1920" data-category-height="1080" data-category-id="364">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/364/pres-16x9.png" alt="Presentation (16:9)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Presentation (16:9)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1920 x 1080 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-365" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1024" data-category-height="768" data-category-id="365">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/365/pres-4x3.png" alt="Presentation (4:3)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Presentation (4:3)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1024 x 768 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-168" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1200" data-category-height="1200" data-category-id="168">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/168/linkedin-post.png" alt="LinkedIn Post" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              LinkedIn Post
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1200 x 1200 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-430" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1500" data-category-height="2100" data-category-id="430">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/430/Vertical.jpg" alt="5x7&quot; Greeting Card (Portrait)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              5x7&quot; Greeting Card (Portrait)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1500 x 2100 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-134" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1080" data-category-height="1920" data-category-id="134">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/134/instagram-story.png" alt="Instagram Story" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Instagram Story
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1080 x 1920 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-397" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1545" data-category-height="2000" data-category-id="397">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/397/resume.png" alt="Resume" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Resume
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1545 x 2000 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-529" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="640" data-category-height="360" data-category-id="529">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/529/Facebook_cover__mobile__3.jpg" alt="Facebook Cover (Mobile) " class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Facebook Cover (Mobile) 
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              640 x 360 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-102" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="2560" data-category-height="1440" data-category-id="102">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/102/youtube-banner.png" alt="Youtube Banner" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Youtube Banner
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              2560 x 1440 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-133" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="851" data-category-height="315" data-category-id="133">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/133/facebook-cover.png" alt="Facebook Cover" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Facebook Cover
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              851 x 315 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-171" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1600" data-category-height="900" data-category-id="171">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/171/twitter-post.png" alt="Twitter Post" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Twitter Post
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1600 x 900 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-172" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1500" data-category-height="500" data-category-id="172">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/172/twitter-header.png" alt="Twitter Header" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Twitter Header
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1500 x 500 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-170" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1584" data-category-height="396" data-category-id="170">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/170/linkedin-banner.png" alt="LinkedIn Banner" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              LinkedIn Banner
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1584 x 396 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-496" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="2100" data-category-height="1500" data-category-id="496">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/496/Horizontal.jpg" alt="5x7&quot; Greeting Card (Landscape)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              5x7&quot; Greeting Card (Landscape)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              2100 x 1500 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-101" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1200" data-category-height="628" data-category-id="101">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/101/facebook-ad.png" alt="Facebook Ad" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Facebook Ad
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1200 x 628 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-463" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="3300" data-category-height="5100" data-category-id="463">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/463/poster.png" alt="Poster (11x17)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Poster (11x17)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              3300 x 5100 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-173" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="940" data-category-height="788" data-category-id="173">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/173/facebook-post.png" alt="Facebook Post" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Facebook Post
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              940 x 788 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-169" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="1280" data-category-height="720" data-category-id="169">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/169/youtube-thumbnail.png" alt="YouTube Thumbnail" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              YouTube Thumbnail
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              1280 x 720 px
            </span>
</li>          <li class="editor-new-design-modal__list__item " id="template-category-332" data-action="click-&gt;editor-new-design#handleCategoryClick" data-editor-v2-landing-main-target="templateCategory" data-category-width="750" data-category-height="750" data-category-id="332">
            <div class="editor-new-design-modal__list__item__thumb-wrapper">
                <img src="https://s3.amazonaws.com/static.vecteezy.com/system/editor/template_categories/thumbnails/000/000/332/business-card-s.png" alt="Business Cards (Square)" class="editor-new-design-modal__thumbnail">
            </div>

            <span class="editor-new-design-modal__category__header">
              Business Cards (Square)
            </span>

            <span class="editor-new-design-modal__category__sub-header">
              750 x 750 px
            </span>
</li>      </ul>
    </div>
  </div>

  <div class="editor-new-design-modal__right">
    <h2 class="editor-new-design-modal__header__right">
      Custom Size
    </h2>

      <div class="editor-new-design-modal__join-pro">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20" role="img" width="18" height="18"><rect width="20" height="20" rx="10" fill="url(#pro-star-circl-dark-icon)"></rect><path fill-rule="evenodd" clip-rule="evenodd" d="M9.262 5.449c.295-.599 1.223-.599 1.518 0l1.097 2.115 2.404.32c.675.08.97.878.464 1.357l-1.73 1.676.422 2.315c.127.638-.59 1.157-1.223.838l-2.193-1.078-2.193 1.078c-.633.319-1.35-.2-1.223-.838l.421-2.315L5.255 9.28c-.506-.478-.21-1.277.464-1.357l2.446-.359L9.262 5.45Z" fill="#fff"></path><defs><linearGradient id="pro-star-circl-dark-icon" x1="20" y1="20" x2="0" y2="0" gradientUnits="userSpaceOnUse"><stop stop-color="#FC06F5"></stop><stop offset="1" stop-color="#FF8706"></stop></linearGradient></defs></svg>

        <div>
          <a data-action="click-&gt;editor-new-design#trackComplete" href="/signups/join-pro">Join Pro</a>
          <p class="editor-new-design-modal__join-pro__text"> to unlock this feature.</p>
        </div>
      </div>

    <div class="editor-new-design-modal__custom-size">
      <div class="editor-new-design-modal__input__container">
        <span class="editor-new-design-modal__input__label">Width</span>
        <input
          autocomplete="off"
          data-editor-new-design-target="categoryWidthInput"
          aria-label="Project Width"
          class="ez-input__field ez-input__field--basic editor-new-design-modal__input"
          data-action="input->editor-new-design#removeAnyActiveCategoryItem"
          disabled
          type="number"
          value="1200">
      </div>
      <div class="editor-new-design-modal__input__container">
        <span class="editor-new-design-modal__input__label">Height</span>
        <input
          autocomplete="off"
          data-editor-new-design-target="categoryHeightInput"
          data-action="input->editor-new-design#removeAnyActiveCategoryItem"
          aria-label="Project Height"
          class="ez-input__field ez-input__field--basic editor-new-design-modal__input"
          disabled
          type="number"
          value="1200">
      </div>
    </div>

    <div class="ez-btn ez-btn--primary editor-new-design-modal__button" data-action="click-&gt;editor-new-design#handleNewProjectCreate" data-href="/edit/new?resource=1237281">Create</div>
  </div>
</div>

      </div>
    </div>
  </div>
</dialog></template></turbo-stream>