Introduction
Your film is picture-locked. The trailer is cut. The poster key art is sitting in Photoshop waiting for one final piece: the title treatment. You have spent two hours scrolling through Google Fonts trying to find something that reads "psychological horror" without looking like a Halloween store sign. You tried Kapwing but the free export slapped a watermark across your title. Canva wanted $12.99 per month to unlock the font you needed. You opened Photoshop, typed the title, and realized you have no idea how to build a gradient fill that does not look like a 2008 MySpace header.
The Title Logo Maker runs entirely in your browser. Type your title, pick from 15 curated film-title fonts (all free for commercial use under the SIL Open Font License), apply gradient fills, strokes, drop shadows, and outer glows, then export a transparent PNG at 1x, 2x, or 4x resolution, or an SVG vector file. No account, no watermark, no server round-trip. The preview updates in real time as you adjust every slider and color picker.
What This Tool Calculates
The tool takes the following inputs and renders a live preview that you can export as a raster or vector image:
**Text inputs:** Title text (single or multi-line), font family (15 curated Google Fonts selected for film title use cases), font weight (Regular 400, Bold 700, Black 900), font size (24 to 240px), letter spacing (-10 to 40px), line height (0.8 to 2.5), text alignment (left, center, right), rotation (-180 to 180 degrees), and opacity (0 to 100%).
**Fill inputs:** Solid color (hex picker) or gradient fill (linear or radial, 2 to N color stops with adjustable positions 0 to 100%, gradient angle 0 to 360 degrees for linear mode).
**Effect inputs:** Stroke/outline (enable/disable, color, width 0.5 to 12px), drop shadow (enable/disable, color, blur 0 to 50px, offset X and Y -30 to 30px), outer glow (enable/disable, color, blur intensity 1 to 60px).
**Background inputs:** Transparent (default, produces alpha-channel PNG and SVG with no background) or solid color.
**Outputs:** Real-time HTML/CSS preview, exportable as PNG at 1x, 2x, or 4x scale, SVG vector, or PDF. The tool uses dom-to-image for rasterization and jsPDF for PDF export. All processing is client-side.
The Formula and How It Works
The tool renders text using CSS properties that map directly to canvas-equivalent operations. Understanding how each CSS property translates to visual output helps you control the final result.
**Gradient fill** uses the CSS background-clip: text technique. The gradient is applied as a background on the text element, then background-clip: text and WebkitTextFillColor: transparent clip the gradient to the shape of the letters. The angle parameter maps to the CSS linear-gradient(angleDeg, stop1 pos1%, stop2 pos2%, ...) syntax. A 90-degree gradient runs top-to-bottom. A 0-degree gradient runs left-to-right. For radial gradients, the CSS radial-gradient(circle, stops) syntax creates a center-outward blend. This technique is documented in the CSS Backgrounds and Borders Module Level 3 specification from the W3C.
**Drop shadow** uses the CSS text-shadow property: offsetXpx offsetYpx blurpx color. Positive X offsets cast shadow to the right, positive Y offsets cast shadow downward. Blur of 0 produces a hard-edged shadow. Blur of 20px produces a soft, diffuse shadow. The CSS Text Decoration Module Level 3 defines this property.
**Outer glow** stacks two text-shadow layers with 0 offset: 0 0 blurpx color and 0 0 (blur * 2)px color. The first layer creates the core glow, the second creates the diffuse halo. Increasing the blur value widens the glow radius.
**Stroke/outline** uses the CSS WebkitTextStroke property: widthpx color. This renders an outline around each letterform. Unlike canvas strokeText, which draws the stroke centered on the path, WebkitTextStroke draws the stroke inside the letter shape. The CSS Text Module Level 3 covers text rendering properties.
**Export resolution scaling** works by passing a scale parameter to dom-to-image toPng() method. At scale 2, the export canvas is twice the pixel dimensions of the preview element, producing a 2x retina-quality image. At scale 4, the output is 4x the preview dimensions, suitable for print at 150 DPI. For a 600px wide preview, 4x produces a 2400px wide PNG.
Worked example: A title set in Cinzel Bold at 96px with a linear gradient from #8B0000 (dark red, position 0%) to #FFD700 (gold, position 100%) at 90 degrees, a 2px black stroke, and a drop shadow at offset 4,4 with 12px blur. The gradient clips to the letterforms via background-clip: text. The stroke renders as a 2px black outline inside each letter edge. The shadow renders as a semi-transparent black copy offset 4px right and 4px down with a 12px gaussian blur. At 4x export, the 600px preview becomes a 2400px PNG, suitable for a 27x40 one-sheet at approximately 89 DPI.
Real-World Examples
Example 1: Horror Short Title Card for Festival Submission
A filmmaker is preparing the title card for her 15-minute horror short screening at Panic Fest 2026. She needs a title treatment that reads "WHISPER HOLLOW" in a distressed, unsettling style. She selects Pirata One at 120px with a solid fill of #2C2C2C (near-black), letter spacing at 6px for a stretched, uneasy feel. She enables a 1px stroke in #8B0000 (dark red) to add a subtle blood-tinged outline. She adds a drop shadow in rgba(0,0,0,0.8) at offset 3,3 with 8px blur for depth against the black title card background. She enables an outer glow in #4A0000 at 25px blur for a faint red halo. She exports a 4x PNG (2400px wide) for the DCP title card and an SVG to send to the festival for their web banner. Total time: 6 minutes. The festival programmer compliments the title treatment in the acceptance email.
Example 2: Period Drama One-Sheet Title for Investor Pitch
A producer is building a pitch deck for a 1940s period drama called "THE LAST LETTER." He needs a title treatment that signals prestige and period authenticity. He selects Cinzel at 900 weight (Black) and 84px, letter spacing at 4px. He applies a linear gradient from #1a1a2e (dark navy, 0%) to #C4A484 (antique gold, 50%) to #1a1a2e (dark navy, 100%) at 90 degrees, creating a metallic gold sheen across the letterforms. He adds a drop shadow in rgba(0,0,0,0.5) at offset 2,4 with 6px blur for subtle depth. No stroke, no glow. He sets the background to #F5F0E8 (parchment cream) to match the pitch deck's key art. He exports a 2x PNG for the digital pitch deck and a 4x PNG for the printed leave-behind one-sheet. The investors comment that the title treatment "looks like a real movie poster."
Example 3: Action Feature Title for Social Media Campaign
A marketing director is creating social media assets for an indie action film called "ROGUE PROTOCOL." She needs a bold, high-impact title treatment for Instagram, Twitter, and YouTube thumbnails. She selects Anton at 140px with letter spacing at -2px for a tight, aggressive look. She applies a linear gradient from #FF4500 (orange-red, 0%) to #FFD700 (gold, 100%) at 0 degrees (left-to-right), giving the title a fiery, energy-weapon feel. She enables a 3px stroke in #000000 for maximum contrast against any background. She adds a drop shadow in rgba(0,0,0,0.7) at offset 5,5 with 15px blur for a strong grounded look. She enables an outer glow in #FF6B00 at 30px blur for a subtle heat distortion effect. She exports three versions: 1x PNG (600px) for Twitter, 2x PNG (1200px) for Instagram, and 4x PNG (2400px) for the YouTube channel banner. She also exports an SVG for the film's website header, where the title needs to scale responsively from 320px to 1920px without pixelation. The entire social media title package takes 8 minutes to produce.
Title Logo and Film Text Generator Tools Compared (2026)
| Tool / Method | Price | Watermark | Export Formats | Transparent PNG | Free Fonts | Browser-Based | No Account |
|---|---|---|---|---|---|---|---|
| Tools for Film (this tool) | Free | No watermark | PNG 1x/2x/4x, SVG, PDF | Yes (default) | 15 Google Fonts (OFL 1.1) | Yes (100% client-side) | Yes |
| FontVibe AI Cinematic | Free | No watermark | PNG, JPG | Yes (AI-removed bg) | AI-generated styles | Yes | Yes |
| Kapwing | Free + paid ($16/mo) | Watermark on free | PNG, MP4 | Paid only | 200+ fonts (paid) | Yes | No (account required) |
| Canva | Free + paid ($12.99/mo) | No watermark | PNG, JPG, PDF | Yes | 200+ fonts (many paid) | Yes | No (account required) |
| Snappa | 3 free downloads/mo | No watermark | PNG, JPG | Yes | 200+ fonts | Yes | No (account required) |
| FontsPool Movie Generator | Free | No watermark | PNG, JPG | Yes | Movie-style fonts | Yes | Yes |
| Photoshop / Illustrator | $20+/mo (Adobe CC) | No watermark | Any format | Yes | Requires commercial font license | No (desktop app) | No (Adobe account) |
Pro Tips and Common Mistakes
Pro Tips
- Match your font to your genre. Cinzel and Playfair Display signal prestige and period drama. Bebas Neue and Anton read as action and thriller. Pirata One and Nosifer are horror-only. Special Elite works for noir, detective, and documentary. Using Cinzel for a slasher film or Nosifer for a romantic comedy creates cognitive dissonance that undermines your key art before the audience reads a single word.
- Gradient fills work best with 2 or 3 stops and a 90-degree angle (top-to-bottom). The classic film title gradient is dark-to-light-to-dark (e.g., #1a1a2e at 0%, #C4A484 at 50%, #1a1a2e at 100%), which creates a metallic sheen across the letterforms. Avoid rainbow gradients with 5+ stops. They look like a 2008 web button, not a movie title.
- Stroke width should be proportional to font size. At 96px, a 2px stroke is subtle and professional. At 140px, you can go to 3px. At 48px, even 1px is visible. A stroke wider than 5px at any size starts to close the counters (the enclosed spaces inside letters like O, A, B) and makes the title illegible at small sizes. Always test your title at the actual display size before exporting.
- Export at 4x for any print application. A 600px preview at 4x produces a 2400px PNG, which is sufficient for a 27x40 one-sheet at 89 DPI. For offset printing at 300 DPI, use the SVG export instead. SVG is vector artwork: it scales to any resolution without quality loss, and your print vendor can open it in Illustrator and scale it to the exact dimensions they need.
- Transparent PNG is the default for a reason. Film titles almost always sit on top of key art, not on a solid background. Export with transparency enabled so you can composite the title over your poster art in Photoshop, Canva, or your video editor. If you need a solid background for a specific use case (social media post, pitch deck slide), disable transparency and set the background color to match your destination.
Common Mistakes
- Using trademarked or copyrighted movie title fonts. Many iconic film title fonts (the Star Wars logo font, the Jurassic Park font, the Lord of the Rings font) are proprietary designs protected by trademark and copyright. Reproducing them for your own film's title creates legal exposure, especially if your film receives distribution. The 15 fonts in this tool are all released under the SIL Open Font License 1.1, which permits commercial use, embedding, and modification with no attribution required. If you need a specific look, find the closest OFL-licensed alternative rather than copying a protected design.
- Applying glow to every title. Outer glow is a strong effect that works for sci-fi, horror, and fantasy titles. It looks wrong on period dramas, documentaries, and romantic films. If your film is a grounded drama, use a subtle drop shadow (offset 2,2, blur 4px, rgba(0,0,0,0.3)) and skip the glow entirely. Glow on a prestige drama title signals 'student film' to distributors and festival programmers.
- Exporting at 1x for print. A 1x PNG from a 600px preview is 600px wide. At 150 DPI (standard digital print), that is 4 inches wide. On a 27x40 one-sheet, your title would be 4 inches across, barely readable. Always export at 4x for print, or use SVG for unlimited resolution. 1x is fine for web thumbnails and social media posts where the title will display at 300 to 600px wide.
Frequently Asked Questions
What is a title logo in filmmaking?
A title logo (or title treatment) is the designed typography that displays the film's title on posters, key art, title cards, trailers, and marketing materials. It is more than just a font choice. It includes the lettering style, color treatment, texture, and any visual effects applied to the text. The title logo is one of the first things audiences see, and it sets the tone for the entire film. A horror title in Pirata One with a blood-red gradient tells the audience something different than the same title in Cinzel with a gold metallic sheen. Production designers and key art designers typically create the title treatment during post-production, sometimes working with a specialized title designer for larger-budget films.
Are the fonts in this tool free for commercial use?
Yes. All 15 fonts are hosted on Google Fonts and released under the SIL Open Font License 1.1 (OFL). The OFL permits commercial use, embedding in documents and software, and modification with no attribution required. You can use these fonts in your film's title treatment, poster, trailer, and marketing materials without paying licensing fees. The OFL does not allow you to sell the font files themselves, but using them to render text in a film or poster is fully permitted. Google Fonts provides the CSS API and self-hosting options at no cost.
Can I use the exported PNG or SVG in my film poster?
Yes. The exported image is your creation. The tool applies CSS effects (gradients, shadows, strokes, glows) to OFL-licensed fonts and renders the result as a raster or vector image. You own the output. You can composite the transparent PNG over your key art in Photoshop, Canva, or GIMP. You can open the SVG in Illustrator or Inkscape and make further adjustments. No attribution to this tool is required. If you are using the title treatment in a commercial poster or marketing campaign, your lawyer may still want to verify that the font's OFL license covers your specific use case, but the OFL is written to permit all commercial uses.
What resolution should I export at for my film poster?
For a standard 27x40 inch one-sheet printed at 150 DPI (digital printing), you need approximately 4050x6000 pixels. Export at 4x from a preview that is at least 1013px wide to hit that resolution. For offset printing at 300 DPI, use the SVG export instead. SVG is vector artwork that scales to any resolution without pixelation. Your print vendor can scale the SVG to the exact dimensions they need. For web and social media, 2x is usually sufficient. A 600px preview at 2x produces a 1200px PNG, which is the standard width for Instagram posts and YouTube thumbnails.
How do I make my film title look professional?
Three principles: restraint, contrast, and consistency. Restraint means using 1 or 2 effects, not all of them. A gradient fill with a subtle drop shadow looks professional. A gradient fill with a stroke, drop shadow, outer glow, and 15px letter spacing looks like a YouTube thumbnail from 2012. Contrast means your title must be readable against its background. If your key art is dark, use a light title with a dark drop shadow. If your key art is light, use a dark title. Consistency means your title treatment should match your film's genre and tone. A horror film title in Cinzel (a classical Roman serif) sends the wrong signal. Match the font category to the genre, and the effect stack to the mood.
Can I use this tool to recreate a famous movie title logo?
You should not recreate trademarked movie title logos. Film titles, logo designs, and title treatments can be protected by trademark law, copyright law, or both. Recreating the Star Wars, Jurassic Park, or Lord of the Rings title logo for your own project creates legal exposure, even if your film is non-commercial. Instead, use this tool to create an original title treatment that captures the mood and genre of your film without copying a specific protected design. The 15 fonts in this tool cover the major genre categories (epic, horror, action, period, noir, modern) and give you enough range to build a distinctive title without infringing on existing trademarks.
Start Calculating
A strong title treatment signals professionalism to distributors, festival programmers, and audiences before they watch a single frame. The Title Logo Maker gives you 15 curated film-title fonts, gradient fills, strokes, shadows, and glows, with transparent PNG and SVG export at print-ready resolution. No watermark, no account, no server.
What font are you using for your current film's title treatment, and have you ever had a distributor or festival ask you to change it? Build your title above, preview it in real time, and export at the resolution your deliverable requires.
Some links in this post are affiliate links. If you purchase through them, Tools for Film earns a small commission at no extra cost to you. This support helps us keep our calculators and tools free.
