Recently, I discovered mvoloskov’s potion project on Github and decided to give it a try. It turned out to be cool. mvoloskov’s potion is basically a CSS file that makes your HTML pages look much like a Notion public page — that header image, icon, and everything.
I created a sample Lorem Ipsum page to test it out and here’s how it looks:
Much like Notion, right?
For this to work, you just have to add the following line in the <head></head> section of your .html file.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/mvoloskov/potion/potion.min.css">That’s it.
Now if you open the .html in the browser, it will look like a Notion page. For more customization options, look at the Github repo.
If you get stuck somewhere, let me know in the comments below.