@limonify/email-templates

v1.1.1

Published

3 days ago

Design-system-first email template suite for Go, Node, and Python backends — crafted with @limonify/ui tokens, OKLCH parser, and multi-language support

0High
0Medium
0Low

limonify

limonify email email-templates react-email golang-templates html-email design-system i18n newsletter transactional-email

✨ Features

🖤 Authentic Limonify UI Craft: Precision double-frame cards, segmented OTP inputs, quiet status dot badges, and monochrome aesthetics matching @limonify/ui web and native components.
📧 Bulletproof Email Client Compatibility: Compiled down to table-based inline-styled HTML tested on Gmail, Apple Mail, Outlook (Word engine), and mobile email clients.
🎨 Mathematical OKLCH CSS Color Parser: Automatically translates modern CSS custom properties (oklch(14.5% 0 0)) from your theme stylesheet into cross-client static #HEX colors.
⚡ Zero-Runtime Overhead in Production: Pre-compiled localized templates (/en/otp.html, /tr/otp.html) allow Go, Python, and Node.js backends to render in <1 ms without runtime template compilation.
🌐 Built-in Multi-Language (i18n): Out-of-the-box translations for 5 languages (English, Turkish, German, Spanish, French) + 1-step custom language additions via ./locales/*.json.
🖥️ Live Interactive Preview Studio: Built-in visual dashboard (bun run preview) with Dark/Light toggle, language switcher, mobile/desktop viewports, and 1-click HTML copy.

🚀 Quick Start

Run the interactive CLI generator without installing:

# Using Bun
bunx @limonify/email-templates

# Using NPM / NPX
npx @limonify/email-templates

# Using PNPM
pnpm dlx @limonify/email-templates

Or launch the Live Interactive Preview Studio at http://localhost:3000:

bunx @limonify/email-templates preview

📦 26 Production-Grade Templates

🐹 Go Backend Integration

package main

import (
	"bytes"
	"embed"
	"fmt"
	"html/template"
	"log"
)

//go:embed templates/emails/*/*.html
var emailTemplatesFS embed.FS

type MailService struct {
	tmpl *template.Template
}

func NewMailService() (*MailService, error) {
	t, err := template.ParseFS(emailTemplatesFS, "templates/emails/*/*.html")
	if err != nil {
		return nil, fmt.Errorf("failed to parse email templates: %w", err)
	}
	return &MailService{tmpl: t}, nil
}

func (s *MailService) RenderEmail(locale, templateName string, data any) (string, error) {
	var buf bytes.Buffer
	targetPath := fmt.Sprintf("%s/%s.html", locale, templateName)

	err := s.tmpl.ExecuteTemplate(&buf, targetPath, data)
	if err != nil {
		// Fallback to English if locale template is not found
		fallbackPath := fmt.Sprintf("en/%s.html", templateName)
		err = s.tmpl.ExecuteTemplate(&buf, fallbackPath, data)
		if err != nil {
			return "", err
		}
	}
	return buf.String(), nil
}

func main() {
	mailer, err := NewMailService()
	if err != nil {
		log.Fatal(err)
	}

	data := map[string]any{
		"AppName":   "Limonify",
		"Code":      "849201",
		"ExpiresIn": "10 minutes",
	}

	html, err := mailer.RenderEmail("en", "otp", data)
	if err != nil {
		log.Fatal(err)
	}

	fmt.Println("Rendered HTML length:", len(html), "bytes")
}

🟢 Node.js / TypeScript Integration

import {
  renderTemplateToHtml,
  defaultLimonifyDarkTheme,
  registerCustomLocale,
} from "@limonify/email-templates";

// Render localized template to static HTML
const html = await renderTemplateToHtml(
  "daily-newsletter",
  defaultLimonifyDarkTheme,
  "handlebars", // or 'go' | 'raw'
  {
    appName: "Limonify Daily",
    logoUrl:
      "https://raw.githubusercontent.com/limonify/email-templates/main/.github/assets/logo.png",
  },
  {
    issueNumber: "#142",
    date: "Monday, August 31, 2026",
  },
  "en", // locale
);

🌐 Multi-Language (i18n) & Custom Locales

Method 1: Adding JSON files to `./locales/` (Zero Config)

Create a locales/ directory in your project root and drop any {lang}.json file:

my-project/
├── locales/
│   ├── it.json    # Italian overrides
│   └── ja.json    # Japanese overrides
└── limonify-email.config.json

Example locales/it.json:

{
  "otp": {
    "badgeText": "Sicurezza",
    "heading": "Codice di verifica",
    "description": "Usa questo codice monouso per completare l'accesso:"
  }
}

Method 2: Via `limonify-email.config.json`

{
  "locales": ["en", "tr", "de", "es", "fr", "it"],
  "translations": {
    "it": {
      "welcome": {
        "heading": "Benvenuto in {{ .AppName }}"
      }
    }
  }
}

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme