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

#1A171B

#B0BC04

#7CA04D

#BCCE9F

#DDDDDD

#FFFFFF


Typeface Exo


Rakkan Logo


Bamboo Illustration

Homepage

Homepage

Subpages

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