To diagnose an Affinity SVG that looks blurred or unexpectedly filled, isolate one affected curve, compare rasterization settings, then inspect its fill and fill mode. These tests help separate export limitations from object settings and differences in the receiving app.

This guide covers exporting a vector drawing from the current Affinity desktop app on a Mac and checking its appearance in a browser or another desktop application. Menu paths follow the current Affinity Help Center; older Affinity Designer releases may use different menu locations.

Start with one curve and a controlled export

Save a working copy of your Affinity document. Choose one curve that clearly shows the problem, and write down the expected result: for example, “a blue curved stroke with no interior fill” or “a filled ring with a transparent center.” This makes it easier to judge each test without changing several unrelated properties.

Open File > Export > Export, choose SVG as the file format, and inspect the settings on the right. Additional controls appear under Advanced. For an isolated object, choose Area: Selection Only; Selection Area also includes overlapping layers. Affinity documents these distinctions in its Export dialog help.

Export a baseline file before changing anything. Open it in Safari and in the application where you noticed the problem. Compare the same region at a similar displayed size, then enlarge it. Record whether the defect appears in both applications, only in the destination, or already in Affinity’s export preview.

Treat this comparison as a diagnostic aid. Agreement between two viewers increases confidence that you are investigating the exported content, but it does not identify the cause by itself. A difference between viewers gives you a narrower compatibility question to investigate.

Visible symptom First test What the result helps distinguish
A curve becomes soft when enlarged Compare rasterization settings Rasterized content versus retained geometry
A curved stroke gains a solid interior Inspect the selected object’s fill Unwanted fill versus stroke appearance
A hole disappears or an overlap fills Compare fill modes Different definitions of the shape’s interior
Only one receiving app displays the file incorrectly Test a simplified copy Destination handling versus a general export problem

Why can an SVG contain blurred curves?

An SVG extension does not mean every object inside the file remains a scalable vector. Affinity explicitly notes that raster objects within SVG files still degrade when resized. Its Working with SVGs documentation also recommends positioning web artwork on whole pixels to help keep it crisp.

First ask whether the softness affects the entire drawing or one decorated object. A plain curve that stays sharp beside a soft object suggests a different investigation from a drawing in which every element becomes soft. Use that observation to decide which object to isolate next.

Compare the three rasterization choices

Affinity’s SVG export contract offers three Rasterize choices: Nothing performs no export rasterization and excludes unsupported elements; Unsupported properties rasterizes unsupported elements; Everything rasterizes all elements. Consequently, Nothing can remove content rather than preserve its appearance as vectors. See Export Settings.

Make separate exports using Unsupported properties and Nothing, keeping the area and other settings unchanged. Compare the affected curve, its decoration, and any missing content. Use filenames that identify the changed setting so the comparison remains traceable.

If the affected content disappears with Nothing, that result is consistent with the documented unsupported-content boundary. It is a reason to simplify the isolated object and repeat the test. It does not establish that the entire original object was vector-compatible.

If a plain version of the curve exports correctly, restore its styling one change at a time. Stop when the symptom returns. This sequence identifies a smaller reproducible combination without assuming that every effect, brush, or object arrangement has the same export behavior.

Choose between preserving appearance and preserving geometry

For retained raster content, Raster DPI controls the resolution of rasterized effects; Downsample images can reduce raster resolution. Allow JPEG compression and its Quality setting affect rasterized content. Use tile patterns may wrap a rasterized area in a bitmap-filled vector shape, with limited support in some apps. These are documented in Export Settings.

For a diagnostic export, disable downsampling and JPEG compression, then compare the same object again. If you retain a rasterized appearance, assess it at its intended final size. Increasing raster resolution does not rebuild an editable curve; it addresses the raster portion of the result.

For an output that must retain scalable geometry, simplify or rebuild the problematic appearance using vector objects, then repeat the isolated export. The useful endpoint is an export that contains the intended artwork and behaves correctly when enlarged. A file with missing decoration has not met that endpoint merely because its remaining curves are sharp.

Why does an open curve acquire an unexpected fill?

A curve can have both a stroke and a fill. SVG fills open subpaths as though a closing segment connected their endpoints. This can produce a wedge or broad interior even when the visible stroke remains open. SVG also defines black as the initial fill value, and fill is inherited. These behaviors are specified in SVG 1.1: Painting.

Select the affected curve and open Window > General > Color. Activate the Fill selector and choose the None swatch if the intended artwork is a stroke without an interior. Check that you changed Fill rather than Stroke. The current Color panel documentation identifies the separate selectors and the None swatch.

Re-export the isolated curve. If the interior disappears, check the other affected objects individually before exporting the full drawing. Avoid applying None to every object unless the entire drawing is intended to contain only strokes.

Consider an illustrative open arch: its stroke runs from one endpoint to the other, while a fill can occupy the region between the arch and an implied straight closing edge. Removing the fill addresses that interior directly. Closing the curve changes its geometry and may introduce an unwanted stroked edge.

If the standalone SVG looks correct in Safari but gains a fill after another application imports it, repeat the test with a simple open curve whose fill is explicitly None. That gives you a focused comparison for the destination application. Do not conclude from a black region alone that Affinity necessarily exported black paint.

Why do holes and overlapping regions change?

A filled region inside a complex curve presents a different question from an unwanted fill on a simple open stroke. Affinity provides Alternate and Winding fill modes to determine which regions count as inside a self-intersecting curve. The current command is Vector > Fill Mode, with the object selected. See Fill modes.

Alternate uses an odd-or-even crossing count. Winding uses a signed count that accounts for path direction. In SVG terminology, these correspond to evenodd and nonzero. The distinction matters for self-intersections and nested subpaths, as explained by Affinity’s Fill modes help and the SVG fill-rule specification.

On a duplicate of the affected object, compare both modes. Inspect every intended hole and overlap before choosing one. If direction needs investigation, Affinity documents Show curve orientation under Settings on the Pen Tool or Node Tool context toolbar. This exposes information relevant to Winding behavior. See Fill modes.

For an illustrative nested outline, Alternate can leave an inner region unfilled because a ray crosses two boundaries. Under Winding, the result depends on the directions of those boundaries. Switching modes may restore one hole while changing another overlap, so judge the complete object rather than a single patch.

If neither mode produces the intended shape, return to the curve construction. Make the intended filled regions and openings explicit in your working copy, then export again. Fill mode is a rule for interpreting geometry; it cannot express an arbitrary collection of independently chosen filled and empty regions.

When should you expand a stroke or flatten transforms?

Use Expand Stroke when a reproducible problem concerns the interpretation of a vector stroke. Affinity documents selecting the object with the Move Tool or Node Tool, then choosing Vector > Expand Stroke. The command turns stroke boundaries into closed curves and is specifically documented for preparing strokes before SVG export. See Expand stroke.

Keep the editable original and test an expanded duplicate. Compare the endpoints, joins, thickness, and any enclosed spaces before exporting. Expansion changes the object’s structure, so a successful test should preserve the intended appearance as well as eliminate the destination problem.

There are two documented limitations: an expanded stroke loses editability with its original tool, and strokes made with pixel-based brushes cannot be expanded because they are raster-based. Expansion therefore provides a supported path for vector strokes, without offering a general bitmap-to-vector conversion. See Expand stroke.

For a mismatch involving transformed objects, test Flatten transforms separately. Affinity says this fixes transformed objects in the exported file to improve viewing accuracy across applications. It is a compatibility test with a specific purpose, rather than a universal correction for blur or fills. See Export Settings.

Verify the complete drawing before keeping the fix

After the isolated object exports correctly, repeat the export with the intended full document or artboard. Review it at its actual display size and enlarged, in both Safari and the receiving application. Check the formerly blurred curve, open strokes, transparent holes, overlaps, and surrounding artwork.

Keep a short record of the change that resolved the symptom: removing an unintended fill, choosing the appropriate fill mode, simplifying an unsupported appearance, retaining a raster portion at suitable resolution, expanding a vector stroke, or flattening transforms. This makes the result reproducible without turning a successful setting into a rule for every drawing.

The finished SVG should preserve the artwork you intended, with any retained raster content understood and acceptable at the required size. Keep the editable Affinity source alongside the verified export so later changes can begin from the original curves.

Sources