LapisCV

Guide 简体中文 GitHub

Installation

Typora

  1. Download Release and unzip, set the theme:
    1. Open Typora theme folder: Preferences > Appearance > Open Theme Folder
    2. Copy files to the theme folder: lapis-cv.css, lapis-cv-serif.css, lapis-cv directory
    3. Restart Typora, select Lapis Cv / Lapis Cv Serif from the theme menu.
  2. Open template file to edit.
  3. File > Export > PDF to export the PDF file.

Before exporting, set the page size to A4 and margins to custom in Preferences > Export > PDF, with top and bottom margins of 13mm, and left and right margins of 15mm:

Typora PDF settings

VSCode

  1. Download Release and unzip, open the folder in VSCode.
  2. Install the plugin Markdown PDF.
  3. Open template file, click the preview icon in the top right to view the effect in real-time. Right-click and select Markdown PDF - Export (pdf) to export the PDF file.
  4. Switch themes:

    Modify the style path in .vscode/settings.json: 

    "markdown.styles": [
    "./lapis-cv/styles/main.css",
    "./lapis-cv/styles/lapis-cv.css", // lapis-cv-serif.css for Serif
],

Note: Other VSCode plugins may affect the style. If the effect is inconsistent, check if any plugins are interfering.

Obsidian

Download and unzip Release, open the lapis-cv-obsidian directory as a Vault in Obsidian, edit the template, and export the PDF file.

Switch themes in Options > Appearance > CSS snippets

Obsidian CSS snippets

Features & Customization

Avatar 

<img alt="avatar" src="...">

Replace the src image path when editing the avatar. Delete this line if no avatar is needed.

Note: Obsidian cannot recognize local images inserted in HTML format, so it is recommended to upload the image as a link before inserting.

Icons

Supported Icons:

Icon &#xe60f;
Icon &#xe7ca;
Icon &#xe600;
Icon &#xe618;
Icon &#xe80c;
Icon &#xecfa;
Icon &#xe69c;
Icon &#xe6b3;
Icon &#xe8ae;
Icon &#xe782;
Icon &#xe8b4;
Icon &#xe603;
Icon &#xe8b5;
Icon &#xe638;
Icon &#xe635;
Icon &#xe673;

Page Breaks & Numbers

Page Breaks

Insert --- at the position where a page break is needed.

Page Numbers

Typora

Set the footer in Preferences > Export > PDF, e.g., ${pageNo} / ${totalPages}

VSCode

Modify .vscode/settings.json:

"markdown-pdf.displayHeaderFooter": true,
"markdown-pdf.headerTemplate": "<div></div>",
"markdown-pdf.footerTemplate": "<div style=\"font-size: 9px; margin: 0 auto;\"> <span class='pageNumber'></span> / <span class='totalPages'></span></div>",
Obsidian

The software itself does not support adding page numbers directly. You can install plugins for this.

Margins

Typora

Preferences > Export > PDF

VSCode
  • Directly modify the markdown-pdf.margin related items in the .vscode/settings.json file.
  • Alternatively, modify via GUI:
    1. Open VSCode settings, select the Workspace tab.
    2. Search for Markdown-pdf › Margin, and modify the margins on all sides.
Obsidian

Modify --file-margins in the style file, see Custom Styles below.

Custom Styles

Custom styles can be used to adapt to different content volumes and adjust details according to preferences.

Modify variables in the corresponding editor's style file lapis-cv.css / lapis-cv-serif.css:

Style File Locations
  • Typora: Preferences > Appearance > Open Theme Folder
  • VSCode: lapis-cv/styles in the folder
  • Obsidian: Options > Appearance > CSS snippets > Right button - Open snippets folder
Meanings of Some Custom Variables
/* Custom Configs */

/* Basic Configs */
--text-size: 10pt;                      /* Text font size */
--line-height: 1.8;                     /* Text line height */
--avatar-width: 29mm;                   /* Avatar width */

/* Font Configs */
--h1-size: 16pt;                        /* Level 1 heading font size */
--h2-size: 12pt;                        /* Level 2 heading font size */
--h3-size: 10.5pt;                      /* Level 3 heading font size */
--blockquote-size: 9.3pt;               /* Info block font size */

--text-font: 'SourceHanSansCN';         /* Text font */
--title-font: 'SourceHanSerifCN';       /* Title font */
--link-font: 'JetBrainsMono';           /* Link font */
--code-font: 'JetBrainsMono';           /* Code font */

/* Colors */
--color-accent: #4870ac;                /* Theme color */
--text-normal: #353a42;                 /* Text color, change to pure black if printing is needed */
--link-color: #0563c1;                  /* Link color */

Note: Some styles require restarting the application to take effect.