typogenie/src-tauri/templates

TypoGenie Templates

This folder contains all the document style templates for TypoGenie. Templates are organized by category.

Creating Custom Templates

You can create your own templates! Just create a JSON file with the following structure:

{
  "id": "my-custom-style",
  "name": "My Custom Style",
  "category": "Custom",
  "description": "A brief description of this style",
  "vibe": "Keywords describing the mood",
  "googleFontsImport": "https://fonts.googleapis.com/css2?family=YourFont:wght@400;700&display=swap",
  "wordConfig": {
    "heading1": {
      "font": "Your Font",
      "size": 28,
      "color": "000000",
      "bold": true,
      "align": "left",
      "spacing": { "before": 400, "after": 200, "line": 240 }
    },
    "heading2": {
      "font": "Your Font",
      "size": 14,
      "color": "333333",
      "bold": true,
      "align": "left",
      "spacing": { "before": 280, "after": 140, "line": 240 }
    },
    "body": {
      "font": "Your Font",
      "size": 11,
      "color": "333333",
      "align": "left",
      "spacing": { "before": 0, "after": 180, "line": 300 }
    },
    "accentColor": "FF5733"
  },
  "previewCss": "font-family: 'Your Font', sans-serif; h1 { font-size: 28pt; font-weight: 700; color: #000; margin-bottom: 20px; }"
}

Template Structure

Required Fields

• id: Unique identifier (lowercase, no spaces)
• name: Display name for the UI
• category: Category for grouping (e.g., "Minimalist", "Editorial", "Tech")
• description: Short description shown in the UI
• vibe: Keywords describing the style
• googleFontsImport: URL to import fonts from Google Fonts
• wordConfig: Configuration for Word document generation
• previewCss: CSS for the preview pane

Word Config Options

For each style (heading1, heading2, body):

• font: Font family name (must match Google Fonts import)
• size: Font size in points
• color: Hex color without # (e.g., "000000")
• bold: true/false
• italic: true/false
• underline: true/false
• allCaps: true/false
• smallCaps: true/false
• tracking: Letter spacing in twips (1/20 of a point)
• align: "left", "center", "right", "both" (justify)
• spacing: Object with before, after, and line (all in twips)
• border: Optional border configuration
• shading: Optional background shading

Where to Place Templates

For Personal Use (Recommended)

Place templates in the user data folder:

• Windows: %APPDATA%/TypoGenie/TypoGenie-Data/templates/
• macOS: ~/Library/Application Support/TypoGenie/TypoGenie-Data/templates/
• Linux: ~/.config/TypoGenie/TypoGenie-Data/templates/

Or use the "Open Templates Folder" button in the app.

For Distribution

Place templates in this folder (src-tauri/templates/) organized by category subfolders, then rebuild the app.

Categories

• Core: Essential versatile styles
• Minimalist: Clean, simple designs
• Editorial: Magazine and newspaper styles
• Corporate: Business and professional
• Tech: Technology and startup
• Creative: Bold and artistic
• Vintage: Retro and nostalgic
• Lifestyle: Elegant and refined
• Academic: Scholarly and formal
• Industrial: Raw and utilitarian

Tips

1. Test your template with various content types (headings, lists, code blocks, etc.)
2. Ensure the Word config and preview CSS match for consistency
3. Use web-safe fonts or Google Fonts for best compatibility
4. Colors should be hex without the # prefix in wordConfig
5. Colors should be hex WITH the # prefix in previewCss