diff --git a/modules/coa-generator.js b/modules/coa-generator.js
index 2a8bfda8..2bdb195e 100644
--- a/modules/coa-generator.js
+++ b/modules/coa-generator.js
@@ -398,10 +398,10 @@
 
     function definePattern(pattern, element, size = "") {
       let t1 = null, t2 = null;
-      if (P(.15)) size = "-small";
-      else if (P(.05)) size = "-smaller";
-      else if (P(.035)) size = "-big";
-      else if (P(.001)) size = "-smallest";
+      if (P(.1)) size = "-small";
+      else if (P(.1)) size = "-smaller";
+      else if (P(.01)) size = "-big";
+      else if (P(.005)) size = "-smallest";
 
       // apply standard tinctures
       if (P(.5) && ["vair", "vairInPale", "vairEnPointe"].includes(pattern)) {t1 = "azure"; t2 = "argent";}
diff --git a/modules/coa-renderer.js b/modules/coa-renderer.js
index d4ce075e..03716d7a 100644
--- a/modules/coa-renderer.js
+++ b/modules/coa-renderer.js
@@ -839,11 +839,7 @@
     const divisionClip = division ? `<clipPath id="divisionClip_${id}">${getTemplate(division.division, division.line)}</clipPath>` : "";
     const loadedCharges = await getCharges(coa, id, shieldPath);
     const loadedPatterns = getPatterns(coa, id);
-    const blacklight = `<radialGradient id="backlight_${id}" cx="100%" cy="100%" r="150%">
-    <stop stop-color="#fff" stop-opacity=".3" offset="0"/>
-    <stop stop-color="#fff" stop-opacity=".15" offset=".25"/>
-    <stop stop-color="#000" stop-opacity="0" offset="1"/>
-    </radialGradient>`;
+    const blacklight = `<radialGradient id="backlight_${id}" cx="100%" cy="100%" r="150%"><stop stop-color="#fff" stop-opacity=".3" offset="0"/><stop stop-color="#fff" stop-opacity=".15" offset=".25"/><stop stop-color="#000" stop-opacity="0" offset="1"/></radialGradient>`;
     const field = `<rect x="0" y="0" width="200" height="200" fill="${clr(coa.t1)}"/>`;
     const divisionGroup = division ? templateDivision() : "";
     const overlay = `<path d="${shieldPath}" fill="url(#backlight_${id})" stroke="#333"/>`;
@@ -855,6 +851,7 @@
 
     // insert coa svg to defs
     document.getElementById("coas").insertAdjacentHTML("beforeend", svg);
+    return true;
 
     function templateDivision() {
       let svg = "";
@@ -1000,10 +997,10 @@
   }
 
   function getSizeMod(size) {
-    if (size === "small") return .5;
-    if (size === "smaller") return .25;
-    if (size === "smallest") return .125;
-    if (size === "big") return 2;
+    if (size === "small") return .8;
+    if (size === "smaller") return .5;
+    if (size === "smallest") return .25;
+    if (size === "big") return 1.6;
     return 1;
   }
 
@@ -1027,7 +1024,7 @@
   }
 
   // render coa if does not exist
-  const trigger = function(id, coa) {
+  const trigger = async function(id, coa) {
     if (coa === "custom") {
       console.warn("Cannot render custom emblem", coa);
       return;
@@ -1036,7 +1033,7 @@
       console.warn(`Emblem ${id} is undefined`);
       return;
     }
-    if (!document.getElementById(id)) draw(id, coa);
+    if (!document.getElementById(id)) return draw(id, coa);
   }
 
   const add = function(type, i, coa, x, y) {
diff --git a/modules/ui/emblems-editor.js b/modules/ui/emblems-editor.js
index 0d9b4b58..a2a14520 100644
--- a/modules/ui/emblems-editor.js
+++ b/modules/ui/emblems-editor.js
@@ -271,41 +271,41 @@ function editEmblem(type, id, el) {
   }
 
   async function getURL(svg, size) {
-    const clone = svg.cloneNode(true); // clone svg
-    clone.setAttribute("width", size);
-    clone.setAttribute("height", size);
-    const serialized = (new XMLSerializer()).serializeToString(clone);
+    const serialized = getSVG(svg, size);
     const blob = new Blob([serialized], {type: 'image/svg+xml;charset=utf-8'});
     const url = window.URL.createObjectURL(blob);
     window.setTimeout(() => window.URL.revokeObjectURL(url), 6000);
     return url;
   }
 
-  function downloadGallery() {
+  function getSVG(svg, size) {
+    const clone = svg.cloneNode(true);
+    clone.setAttribute("width", size);
+    clone.setAttribute("height", size);
+    return (new XMLSerializer()).serializeToString(clone);
+  }
+
+  async function downloadGallery() {
     const name = getFileName("Emblems Gallery");
     const validStates = pack.states.filter(s => s.i && !s.removed && s.coa);
     const validProvinces = pack.provinces.filter(p => p.i && !p.removed && p.coa);
     const validBurgs = pack.burgs.filter(b => b.i && !b.removed && b.coa);
-    triggerCOALoad(validStates, validProvinces, validBurgs);
-    const timeout = (validStates.length + validProvinces.length + validBurgs.length) * 8;
-    tip("Preparing to download...", true, "warn", timeout);
-    d3.timeout(runDownload, timeout);
+    await renderAllEmblems(validStates, validProvinces, validBurgs);
+    runDownload();
 
     function runDownload() {
       const back = `<a href="javascript:history.back()">Go Back</a>`;
 
       const stateSection = `<div><h2>States</h2>` + validStates.map(state => {
         const el = document.getElementById("stateCOA"+state.i);
-        const svg = getSVG(el, state.coa, 200);
-        return `<figure id="state_${state.i}"><a href="#provinces_${state.i}"><figcaption>${state.fullName}</figcaption>${svg}</a></figure>`;
+        return `<figure id="state_${state.i}"><a href="#provinces_${state.i}"><figcaption>${state.fullName}</figcaption>${getSVG(el, 200)}</a></figure>`;
       }).join("") + `</div>`;
 
       const provinceSections = validStates.map(state => {
         const stateProvinces = validProvinces.filter(p => p.state === state.i);
         const figures = stateProvinces.map(province => {
           const el = document.getElementById("provinceCOA"+province.i);
-          const svg = getSVG(el, province.coa, 200);
-          return `<figure id="province_${province.i}"><a href="#burgs_${province.i}"><figcaption>${province.fullName}</figcaption>${svg}</a></figure>`;
+          return `<figure id="province_${province.i}"><a href="#burgs_${province.i}"><figcaption>${province.fullName}</figcaption>${getSVG(el, 200)}</a></figure>`;
         }).join("");
         return stateProvinces.length ? `<div id="provinces_${state.i}">${back}<h2>${state.fullName} provinces</h2>${figures}</div>` : "";
       }).join("");
@@ -316,8 +316,7 @@ function editEmblem(type, id, el) {
           const provinceBurgs = stateBurgs.filter(b => pack.cells.province[b.cell] === province.i);
           const provinceBurgFigures = provinceBurgs.map(burg => {
             const el = document.getElementById("burgCOA"+burg.i);
-            const svg = getSVG(el, burg.coa, 200);
-            return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${svg}</figure>`;
+            return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${getSVG(el, 200)}</figure>`;
           }).join("");
           return provinceBurgs.length ? `<div id="burgs_${province.i}">${back}<h2>${province.fullName} burgs</h2>${provinceBurgFigures}</div>` : "";
         }).join("");
@@ -325,8 +324,7 @@ function editEmblem(type, id, el) {
         const stateBurgOutOfProvinces = stateBurgs.filter(b => !pack.cells.province[b.cell]);
         const stateBurgOutOfProvincesFigures = stateBurgOutOfProvinces.map(burg => {
           const el = document.getElementById("burgCOA"+burg.i);
-          const svg = getSVG(el, burg.coa, 200);
-          return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${svg}</figure>`;
+          return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${getSVG(el, 200)}</figure>`;
         }).join("");
         if (stateBurgOutOfProvincesFigures) stateBurgSections += `<div><h2>${state.fullName} burgs under direct control</h2>${stateBurgOutOfProvincesFigures}</div>`;
         return stateBurgSections;
@@ -335,8 +333,7 @@ function editEmblem(type, id, el) {
       const neutralBurgs = validBurgs.filter(b => !b.state);
       const neutralsSection = neutralBurgs.length ? "<div><h2>Independent burgs</h2>" + neutralBurgs.map(burg => {
         const el = document.getElementById("burgCOA"+burg.i);
-        const svg = getSVG(el, burg.coa, 200);
-        return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${svg}</figure>`;
+        return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${getSVG(el, 200)}</figure>`;
       }).join("") + "</div>" : "";
 
       const FMG = `<a href="https://azgaar.github.io/Fantasy-Map-Generator" target="_blank">Azgaar's Fantasy Map Generator</a>`;
@@ -367,10 +364,15 @@ function editEmblem(type, id, el) {
     }
   }
 
-  function triggerCOALoad(states, provinces, burgs) {
-    states.forEach(state => COArenderer.trigger("stateCOA"+state.i, state.coa));
-    provinces.forEach(province => COArenderer.trigger("provinceCOA"+province.i, province.coa));
-    burgs.forEach(burg => COArenderer.trigger("burgCOA"+burg.i, burg.coa));
+  async function renderAllEmblems(states, provinces, burgs) {
+    tip("Preparing for download...", true, "warn");
+
+    const statePromises = states.map(state => COArenderer.trigger("stateCOA"+state.i, state.coa));
+    const provincePromises = provinces.map(province => COArenderer.trigger("provinceCOA"+province.i, province.coa));
+    const burgPromises = burgs.map(burg => COArenderer.trigger("burgCOA"+burg.i, burg.coa));
+    const promises = [...statePromises, ...provincePromises, ...burgPromises];
+
+    return Promise.allSettled(promises).then(res => clearMainTip());
   }
 
   function dragEmblem() {