> ## Documentation Index
> Fetch the complete documentation index at: https://docs.tight.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Email Branding
> Ensure accounting product emails match your design language
To ensure your new accounting product's emails match with the rest of your brand's design language, Tight offers the
ability for report and invoicing emails to go out from your domain and with customizable design templates that align
with your brand.
## Domain (SMTP) Configuration
Tight uses SMTP to send emails from your domain. Here’s what Tight needs from you:
1. SMTP Username
2. SMTP Password
3. SMTP Host URL (e.g., smtp.mandrillapp.com for Mandrill)
4. SMTP Port (generally 465 for SSL or 587 for TLS)
5. Preferred “From” Address for specific email types:
1. Reports: e.g., [reports@yourcompany.com](mailto:reports@yourcompany.com)
2. Invoices: e.g., [invoices@yourcompany.com](mailto:invoices@yourcompany.com)
## Email Design Customization
Tight can customize two email categories: report emails and invoice emails. Report emails can be split into emails with
an attachment and emails with a link to a download. For each of these report email types, there can be a separate email
for PDF reports and for XLS reports, for a total of four different report-related emails:
1. Report Emails
1. Emails with report attachments
1. XLS
2. PDF
2. Emails with links to reports
1. XLS
2. PDF
2. Invoice Emails
To customize these, please provide an HTML template for each email type (5 total templates).
## Dynamic Content in Templates
Templates can include both dynamic and static content:
1. Dynamic Content: Use double braces with a descriptive name (e.g., `{{ companyName }}`) to denote fields Tight will
populate automatically.
2. Static Content: Include any fixed elements as plain HTML, such as a recurring message or footer.
## Templates
1. Invoice Email HTML Template
An HTML document with the following elements:
1. Inline CSS styles
2. Static content as needed
3. Optional `` tags linking to remote images
4. Dynamic Placeholders:
1. Company Information: `{{ companyName }}`, `{{ companyLogo }}`, `{{ brandColor }}`
2. Invoice Information: `{{ invoiceName }}`, `{{ dueDate }}`, `{{ balanceDue }}`, `{{ clientName }}`, `{{ discount }}`,
and `{{ notes }}`,
3. Line items: `{{ unitPrice }}`, `{{ quantity }}`, `{{ totalAmount }}`
1. Tight can handle line items in a loop, so you only need to indicate line item fields once in your
template
5. A button linking to the invoice (Tight will handle the link insertion).
6. Messaging - Tight uses the same email template for a variety of invoice-related updates. You can provide
messaging for these as desired, otherwise you can use Tight's default messaging in your email template (e.g.,
Invoice Sent, Reminder, Paid, Refunded, Cancelled)
2. Report Email HTML Template with the report attached
1. Inline CSS styles
2. Static content as needed
3. Optional `` tags linking to remote images
4. Optional alternate static content between attached XLS and PDF reports
3. Report Email HTML Template with a link to download the report
1. Inline CSS styles
2. Static content as needed
3. Optional `` tags linking to remote images
4. A download button (Tight will add the link)
5. Optional alternate static content between XLS and PDF linked reports
## Best practices
1. Many email clients do not support certain common CSS properties, notably `box-shadow`, `justify-content`, and `flex`.
Tight recommends using a table (`
`) for your email layout.
1. For a comprehensive list of supported CSS properties by email client,
see [Campaign Monitor’s CSS Guide](https://www.campaignmonitor.com/css/).
2. To test your HTML email, there are various online tools available. Check out
this [list of email preview tools](https://blog.hubspot.com/marketing/free-email-preview-tools).
2. Web fonts are often unsupported by email clients, so using a web-safe font as a backup is recommended. For a list of
web-safe fonts and their support by operating system, see [CSS Font Stack’s Guide](https://www.cssfontstack.com/).
3. For any static images, consider publicly hosting them and providing Tight with a link to embed in your template.
Email clients may encounter issues rendering images, leading to potential resolution drops, slower load times, or
blocking the image altogether. If you decide to use images, make sure your design still stands without them.
4. Embedded CSS using the `
