DEV Community

Cover image for I made a notion themed portfolio 😍
Paul
Paul

Posted on

I made a notion themed portfolio 😍

I created this simple notion portfolio page template using basic html, css, and JS, and you can extend this as well

Features

  • Search
  • Easily add your own content using json and markdown
  • Tailwind css, for rapid development.

Live site

You can view the live site here: Notion portfolio landing page

Screenshot

Notion themed portfolio

How to use

  1. download the portfolio from: https://awesome-landingpages.vercel.app/?search=notion
  • inside data.json make the following changes
{
    "name": "Paul's portfolio",
    "icon": "./assets/images/home/paul.png",

    "pages": [
        {
            "icon": "./assets/images/home/paul.png", // icon can be image, a bootstrap icon class or an emoji
            "name": "About", // name of the page
            "link": "/about", // should be unique
            "content": "content/about.md" // this has to be a path to your md or your html content
        },
        {
            "icon": "📖",
            "name": "Blogs",
            "link": "/blogs",
            "content": "content/blog.html"
        },
        {
            "icon": "bi bi-suitcase-lg-fill",
            "name": "Work Experience",
            "link": "/experience",
            "content": "content/projects.html"
        },
    ]

}
Enter fullscreen mode Exit fullscreen mode

That's it, you have your own notion themed portfolio

Follow

twitter
github

Source code:

Source code for Traveler App landing page Github

Top comments (0)