Martial Arts Website

I redesigned my Martial Arts Online Magazine in 2017. Additionally, I moved the website from Jekyll (as static page generator) to Hugo. I used the CSS Grid Layout throughout the website, the homepage has 12 different grids.

I removed clutter by removing some background patterns, added new hover animations for images and containers, added new buttons, and a new pulsing heart animation for the donation section.

I added Service Worker and full offline support for the website. The source programming is available on GitHub.

Color Palette







Typeface Exo

Rakkan Logo

Bamboo Illustration




Ninjutsu Page

Book Recommendation Page

Grid Layout

CSS Grid Layout 1

CSS Grid Layout 2

CSS Grid Layout 3

CSS Grid Layout 4

Tablet & Phone

Hompage Tablet

Homepage Phone