index.html

---
layout: default
description: Print multiple envelopes for a list of addresses on your own printer right from your browser with Envelist.
scripts:
  - https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js
  - /js/main.js
---

<section>
	<h2>About</h2>
	<p>This site makes it easy to print any number of envelopes quickly and easily in your browser, all for free! It's far easier than normal mail merge. Just type or paste in a list of recipient addresses which you want to send letters to and hit "Print". Envelist will automatically generate a PDF of all the addresses and prompt you to print the envelopes.</p>
	<p>It supports any size envelope, and there's no charge or downloads required. It just uses your own browser and printer.</p>
</section>
<noscript>
	<section>
		<h2>Error</h2>
		<p>Envelist requires JavaScript to function. Please enable JavaScript in your browser.</p>
	</section>
</noscript>
<section>
	<h2>Envelope Size</h2>
	<form>
		<select id="preset-size">
			<option value="#10">#10</option>
		</select>
		<div>
			<input type="number" id="height" min="1" max="36" step="0.125" value="4.125"> in.
			×
			<input type="number" id="width"  min="3" max="36" step="0.125" value="9.5"> in.
		</div>
	</form>
</section>
<section id="font-section">
	<h2>Font</h2>
	<form>
		<label for="preset-font-family">Font Family</label>
		<select id="preset-font-family">
			<option value="Times">Times</option>
		</select>
		<label for="custom-font">Custom Font</label>
		<input type="text" id="custom-font">
		<div id="font-detection-warning" class="warning" style="display: none;">Your browser does not support font detection. We will download fallback fonts just in case.</div>
		<div id="pdf-resolution-warning" class="warning" style="display: none;">High-resolution custom font rendering does not work right in Chrome. It will fallback to a low-resolution image, but if you want a font not native to PDFs, you should use <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>.</div>
	</form>
</section>
<section id="envelope-section">
	<h2>Addresses</h2>
	<div id="envelope">
		<div id="return-address">
			<textarea rows="4" placeholder="Return Address"></textarea>
			<input id="add-return-image" type="file" accept="image/*" required>
			<label for="add-return-image" class="button">🖼️</label>
			<button id="remove-return-image">🗙</button>
		</div>
		<img id="stamp" src="/assets/stamp.svg" alt="Stamp" />
		<textarea id="addresses" rows="15" placeholder="Recipient Addresses"></textarea>
	</div>
	<button id="print-button">Print</button>
</section>
<section>
	<h2>Help</h2>
	<ul>
		<li><a href="{% link _pages/why-is-my-paper-size-wrong.html %}">Why Is My Paper Size Wrong?</a></li>
	</ul>
	<p>If you have any other issues or questions, please <a href="mailto:mminer@gmail.com">email me</a>, and I'll try to help however I can.</p>
</section>