Paste CSV or open a file, and download it as a real table in a PDF, on Letter or A4 paper. The column headers repeat at the top of every page, and every page carries its number. Your CSV never leaves this page.
Valid CSV, separated by commas.
Parsed and rendered on this page8 rows, with 6 columns.
Drag to reorder, or Alt and an arrow key. Select a column to rename it, change its type or hide it.
| Order | Date | Customer | Country | Status | Total |
|---|---|---|---|---|---|
| A-1001 | Sep 2, 2026 | Folio & Sons, Ltd. | IE | paid | $1,440.00 |
| A-1002 | Sep 3, 2026 | Atelier Vink | NL | paid | $320.50 |
| A-1003 | Sep 7, 2026 | Marlborough Books | IE | refunded | $89.99 |
| A-1004 | Sep 11, 2026 | Atelier Vink | NL | paid | $1,600.00 |
| A-1005 | Sep 15, 2026 | Papierfabriek "De Deckle" | NL | pending | $275.00 |
| A-1006 | Sep 21, 2026 | Folio & Sons, Ltd. | IE | paid | $48.00 |
| A-1007 | Sep 24, 2026 | Quire & Bindery | GB | paid | $712.40 |
| A-1008 | Sep 28, 2026 | Marlborough Books | IE | pending | $156.25 |
| Total | $4,642.14 | ||||
The PDF sets this table on US Letter pages, portrait, repeating the column headers at the top of each page and numbering the pages.
Every PDF on this page comes from a quario definition: the report.json in the panel. It names the columns, in order, and says how to present each value. quario renders data rather than CSV text, so read the file into one object per row with the CSV parser you already use. Then render those rows through @quario/pdf, on a server, in a worker, or in the browser, with no headless browser in between.
{
"data": "$[*]",
"style": {
"family": "sans",
"size": 9
},
"header": [
{
"type": "text",
"value": "Orders",
"style": {
"family": "serif",
"size": 15,
"bold": true,
"spaceAfter": 12
}
}
],
"detail": {
"columns": [
{
"header": "Order",
"value": "{{ @.Order }}"
},
{
"header": "Date",
"value": "{{ @.Date }}",
"style": {
"format": "date"
}
},
{
"header": "Customer",
"value": "{{ @.Customer }}"
},
{
"header": "Country",
"value": "{{ @.Country }}"
},
{
"header": "Status",
"value": "{{ @.Status }}"
},
{
"header": {
"value": "Total",
"style": {
"align": "right"
}
},
"value": "{{ round(@.Total, 2) }}",
"style": {
"align": "right",
"format": "currency"
}
}
],
"header": {
"style": {
"family": "mono",
"size": 7,
"uppercase": true,
"color": "#6b7a82",
"paddingBottom": 3,
"borderBottomWidth": 0.5,
"borderBottomStyle": "solid",
"borderBottomColor": "#cfd8dd"
}
},
"row": {
"style": {
"paddingTop": 2,
"paddingBottom": 2,
"borderBottomWidth": 0.25,
"borderBottomStyle": "solid",
"borderBottomColor": "#e6ecef"
}
},
"total": {
"style": {
"bold": true,
"align": "right",
"paddingTop": 5,
"borderTopWidth": 0.75,
"borderTopStyle": "solid",
"borderTopColor": "#1e1f22"
},
"rows": [
{
"cells": [
{
"value": "Total",
"span": 5
},
{
"value": "{{ round($.total0, 2) }}",
"style": {
"format": "currency"
}
}
]
}
]
}
},
"page": {
"orientation": "portrait",
"footer": [
{
"type": "text",
"value": "Page {{ page.number }} of {{ page.total }}",
"style": {
"size": 7,
"color": "#6b7a82",
"align": "right"
}
}
]
},
"aggregates": {
"total0": "sum:[email protected]"
}
}1440.50. In a semicolon or tab file, a decimal comma such as 1.440,50 reads too. A value with a leading zero, such as 007, keeps its column as text. A number column with a name such as Total, Price, or Amount prints in the currency you choose and adds up in the totals row. Dates written as 2026-09-02 print as dates, such as Sep 2, 2026. Select any column to change its type, rename it, or hide it.@quario/pdf.