K.FluentPdf Designer for VS Code
Create and preview PDF designs in Visual Studio Code. The extension edits .kfpdf documents, uses
the K.FluentPdf rendering engine for previews, and can export PDF or generate C# code.
Requirements
- Visual Studio Code 1.90 or later.
- Windows x64 or Arm64.
- .NET 10 runtime available as
dotnet.
Get started
- Open a
.kfpdf file. The visual editor is selected by default. For a new empty file, use the
editor's starter-design action to create a valid document.
- Add elements from the searchable Toolbox, then select them on the page or in the Outline to edit
their properties. Use the Data panel to search available fields.
- Use Design while editing and Preview to inspect rendered pages. The preview uses
representative sample values unless a
<design-name>.sample.json file is beside the design.
- Save with the normal VS Code save command. Use Export PDF to create a PDF or Generate C#
to create source code for your application.
The editor supports text, images, tables, layout elements, data fields, page navigation, zoom, and
table editing actions. Drag items in the Outline to reorder them. Enable Free placement to position
items at exact page coordinates or move positioned elements in the preview.
Preview typed data
Set the design's data.typeName property to your fully qualified C# data type, build the nearest
project, then choose Refresh fields in the Data fields panel. Drag a field into text, or drag a
collection onto a table. The preview creates simulated values matching the class shape; it does not
call your application's APIs or database. A sibling .sample.json file can supply fixed preview data.
The Toolbox contains the following supported design elements:
| Category |
Element |
What it adds |
| Basic Elements |
Text |
A paragraph of static or bound text. |
| Basic Elements |
Heading |
Large, bold text. |
| Basic Elements |
Image |
An image from a file or embedded in the design. |
| Basic Elements |
Line |
A horizontal rule. |
| Basic Elements |
Spacer |
Vertical blank space. |
| Basic Elements |
Page number |
Current page and total page count. |
| Layout |
Column |
Stacks child elements vertically. |
| Layout |
Row |
Places child elements side by side. |
| Layout |
Box |
Wraps one child with padding, border, rounded corners, or background. |
| Layout |
Free area |
Holds elements positioned at exact coordinates within an area. |
| Layout |
Page break |
Continues content on a new page. |
| Tables |
Table |
A grid of rows and columns; supports headers, cell merging, and diagonal cells. |
| Advanced |
Data field |
Text bound to a data value, such as {{Customer.Name}}. |
Requirements for generated code
Generated C# uses the K.FluentPdf NuGet package. Add it to the application project:
dotnet add package K.FluentPdf --prerelease
Troubleshooting
- The render host cannot be found: install the .NET 10 runtime.
- Typed fields are not listed: set
data.typeName, build the nearest C# project, then refresh fields.
- An image fails to load: verify its relative path or embedded image data.
The preview settings include kfluentpdf.dpi (48–300; default 96). Color and image/font paths can be
edited in Properties; file-picker dialogs and some advanced interactions from the Visual Studio
Designer are not yet included in this VS Code version.
