resume-json-pdf

November 23, 2025 ยท View on GitHub

English | ็ฎ€ไฝ“ไธญๆ–‡

๐Ÿ”ฅ Feature

๐Ÿ’• Support Markdown Syntax

(The following syntax can be nested)

  • Italic text: *Italic* will be rendered as Italic
  • Bold text: **Bold** will be rendered as Bold
  • Inline code blocks: `React` `TypeScript` `Tailwind CSS` will be rendered as React TypeScript Tailwind CSS
  • Links: https:// github.com/RylanBot will be rendered as github.com/RylanBot

๐Ÿ’• Support Custom Styles

  • Templates: Versions with and without photos
  • Icons: Refer to the Font Awesome library
  • Fonts: Select or input any local font
  • Colors: Use a color picker
  • Layout: Adjust margins for a reasonable page design

๐Ÿง™๐Ÿป Quick Start

๐Ÿ”ฎ Ready to Use

Live Demo

Parameter

  • Missing a certain field won't result in an error, but the corresponding part will be rendered as blank, potentially causing layout issues.

  • Pay attention to JSON format specifications; missing parentheses, commas, etc., can lead to import failures.

Profile

FieldMeaningNote
name
avatarUploaded online defaults to Base64 storage or modified locally to a image link
footnote[]
contact[]{ "icon": "", "value": "" }

Experience[ ]

FieldMeaningNote
pagePage NumberDefault is 1
section
icon
items[]{ "title": "", "subtitle": "", "timeline": "", "tech": "", "details": ["", ""] }

Style

FieldMeaningNote
templateavatar / plain
fontStyleAny local font name (online selection limited)
colorHexadecimal
pagePyResume Padding YNumber
profileMbProfile Margin bottomNumber
experienceMbExperience Margin bottomNumber
plainFootPxFootnote Padding XNumber (only valid for the plain template)
plainContactPxContact Padding XNumber (only valid for the plain template)
detailsFontExperience Section Font SizeNumber

๐Ÿ”ฎ For Development

If you are familiar with the Web frontend technologies and are interested in source code, you can run this program using the following commands:

npm install
npm run dev

๐ŸŒท Preview

Avatar Template


Plain Template