Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
When fonts look wrong in a PhantomJS screenshot, first verify which PhantomJS executable is running, then inspect the page’s font requests and wait for the page’s asynchronous content before calling page.render. If those checks pass, investigate whether the rendering host can see the intended font and whether the issue is specific to the operating system, PhantomJS build, or PDF output. There is no single fix that applies to every font problem.
Identify the failure before changing fonts
PhantomJS uses a WebKit rendering path, and page.render captures the rendered page. A screenshot showing a fallback typeface can result from a missing or late remote font, a font unavailable to the host, or a different executable or build than expected. Start with the rendered page and its resource activity instead of immediately installing fonts or changing the page’s CSS. The PhantomJS troubleshooting documentation and WebPage API documentation describe the relevant diagnostics and rendering flow.
- Wrong executable: The command may resolve to a different PhantomJS installation than the one you intend.
- Remote font failure or delay: The CSS may request a web font that fails, times out, or has not loaded when rendering begins.
- Host font substitution: The rendering machine may lack the requested family, causing its font matcher to choose a fallback.
- Output or platform difference: The problem may vary by PhantomJS build or host, or concern PDF text behavior rather than screenshot glyph appearance.
Record the exact command, PhantomJS version, host operating system, target URL, output type, and a copy of the resulting image or PDF. This gives you a way to check whether a change actually altered the same failure.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Clear out junk files and repair common Windows errorsFree Scan →Confirm the PhantomJS executable and version
- Run
phantomjs --versionin the same shell, service environment, container, or job runner that creates the screenshot. - Check which executable that environment resolves. On Unix-like systems,
which phantomjscan help; on Windows, usewhere phantomjs. If more than one installation is present, test with the intended executable’s full path. - Run your capture script again and compare the output. If the result changes, check the installation path and deployment configuration before drawing conclusions about fonts.
The PhantomJS troubleshooting page warns that multiple versions can conflict over which executable runs. Its CLI documentation covers PhantomJS 2.1.1 as the latest version for that documentation; that is a historical documentation reference, not evidence of current maintenance or support. See PhantomJS troubleshooting and PhantomJS CLI documentation.
#1 Best Overall
Log font and page-resource requests
Before changing CSS or installing a typeface, determine whether the page actually requests its font and how the request ends. PhantomJS exposes page.onResourceRequested for observing requests, and its WebPage settings include resourceTimeout and onResourceTimeout. Configure settings before the initial page.open; they apply during that opening operation. The WebPage API documentation describes these hooks and settings.
Here is a diagnostic script you can adapt. It logs requested URLs and resource timeouts, and delays rendering after the page-open callback so you can inspect the page and requests. The delay is only a diagnostic pause: it does not prove that every font has loaded. Replace the URL and adjust the timeout and delay for your page.
var page = require('webpage').create();
var system = require('system');
var address = system.args[1] || 'https://example.com/';
page.settings.resourceTimeout = 30000;
page.onResourceRequested = function (requestData) {
console.log('REQUEST ' + requestData.url);
};
page.onResourceTimeout = function (request) {
console.log('RESOURCE TIMEOUT ' + request.url);
};
page.onResourceError = function (resourceError) {
console.log('RESOURCE ERROR ' + resourceError.url + ' :: ' + resourceError.errorString);
};
page.open(address, function (status) {
console.log('PAGE OPEN STATUS ' + status);
if (status !== 'success') {
phantom.exit(1);
return;
}
window.setTimeout(function () {
page.render('phantom-font-check.png');
phantom.exit();
}, 5000);
});Save this as font-check.js, then run phantomjs font-check.js https://your-site.example/. Look for the font URL among the requests, and check whether it reports a timeout or resource error. A failed font request makes fallback plausible, but does not by itself prove the font request is the only cause; inspect the page’s styles and host font availability as well.
Rank #2
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Render only after the page is ready
The PhantomJS Quick Start and screen-capture examples open a page and then call page.render. They do not guarantee that an arbitrary site’s remote fonts or asynchronous application content are ready just because page.open returned. A fixed delay can help isolate a timing issue, but a page-specific readiness condition is more reliable when the page exposes one.
- Wait for a known selector that appears after the relevant content is rendered, if your page provides one.
- For a page you control, expose a JavaScript readiness flag after required content and font setup complete, then check it before rendering.
- Use a delay only as a measured workaround for a known loading pattern; a longer delay cannot repair a failed font request.
- Keep logging resource activity while testing so that a visually changed result is not mistaken for a successfully loaded web font.
The examples in the PhantomJS Quick Start and screen-capture documentation show the basic open-and-render sequence. They do not define a universal readiness test for every site.
Check local font availability on Linux
If the remote font loads but the output still uses another family, check the rendering host. On Linux, Fontconfig handles font matching and fallback. Confirm that the requested font files are installed in the environment where PhantomJS runs and that Fontconfig can see them; a font installed on a developer’s workstation may not exist inside a container or on a separate server.
Rank #3
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
- Identify the exact family requested by the page’s CSS, including its spelling and weight or style variant.
- Check the rendering environment for the corresponding font files and whether Fontconfig recognizes the family. Do this inside the same container or account that runs PhantomJS.
- If you install or change font files, refresh the Fontconfig cache with
fc-cache -fv, then repeat the same capture. - Compare the output before and after, keeping the PhantomJS executable, page, and capture settings constant.
A commenter in a PhantomJS issue discussion reported that installing desired TTF files and running fc-cache -fv fixed a particular Linux substitution problem. That is an environment-specific report, not a universal PhantomJS requirement or guaranteed fix. Fontconfig’s documentation explains its font-matching role: Fontconfig user documentation. The reported PhantomJS case is at the PhantomJS issue discussion.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Do not treat Xvfb as a font fix
Font substitution and display-server setup are different issues. The PhantomJS FAQ says X11/Xvfb is needed only for PhantomJS 1.4 and earlier, and describes version 1.5 onward as pure headless. Adding Xvfb is therefore not a general remedy for a missing or incorrectly matched font. Check the FAQ’s version-specific qualification at the PhantomJS FAQ.
Diagnose PDF output separately
If the output is a PDF, distinguish the appearance of the text from whether it remains selectable or searchable. A historical Linux issue discussion reports a case in which a remote web font was associated with rasterized PDF text; a commenter described installing local TTF files as a workaround. That report concerns PDF text behavior and file size. It does not establish that all screenshot font defects, or all PDFs, have the same cause. See the issue discussion.
When the glyph appearance is wrong, continue checking requests and host font matching. When the glyphs look right but text is not selectable, evaluate the PDF output path specifically rather than applying a screenshot-only diagnosis.
Troubleshoot by symptom
| Symptom | Likely check | Next action |
|---|---|---|
| Unexpected fallback font across pages | Executable path and host font availability | Verify the version and installation actually used; on Linux, check the requested family through Fontconfig. |
| Font is wrong only on one site or intermittently | Remote font request, timeout, or page readiness | Log resource requests and errors; wait for a page-specific ready condition before rendering. |
| Output changes between machines | Build, operating system, installed fonts, and environment | Compare those factors in the actual rendering environments; the available documentation does not establish a current compatibility matrix. |
| PDF text looks right but is rasterized or not selectable | PDF-specific output behavior | Keep this separate from ordinary screenshot appearance; the historical issue report is not proof of a universal cause. |
| Capture fails while diagnosing fonts | Page-open status and resource errors | Resolve page loading or network errors first; a font diagnosis is inconclusive if the page itself did not open successfully. |
Or skip the browser setup
If you need a maintained screenshot workflow instead of troubleshooting a legacy PhantomJS setup, ScreenshotNeo is a website screenshot API and MCP server. One GET request returns an image or PDF. Its capture flow accepts cookie and consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; those steps can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and responses include X-Page-Verdict and X-Billed headers. AI agents can use its MCP tools, including take_screenshot, get_page_info, and capture_pdf.
The Tool Desk
Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Example cURL call (replace the target URL and API key):
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpSee the ScreenshotNeo documentation for setup and request options. Cookie banners, popups, and chat widgets are removed before the shot; bot checks, blank pages, and failed loads are never billed; an MCP server lets AI agents take screenshots; and the Free plan includes 1,000 screenshots a month with no card, while paid plans start at $5 for 3,000. Sign up for free and try ScreenshotNeo.
Limits of the available compatibility evidence
PhantomJS documentation is legacy, and the cited issue discussions are historical community reports rather than controlled tests. The available sources do not establish a current PhantomJS or operating-system compatibility matrix, a present-day support commitment, or a universal font fix. Treat version and platform results as specific to the environment you verify.
Frequently Asked Questions
Does PhantomJS require Xvfb to render fonts?
No general font-rendering requirement is established. The PhantomJS FAQ says X11/Xvfb is needed only for PhantomJS 1.4 and earlier; it describes 1.5 onward as pure headless.
Will increasing resourceTimeout fix a missing font?
Only if the request is timing out and succeeds when given more time. A timeout increase cannot supply an unavailable font or fix a failed request.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
