A playful corner of the internet for learning kanji, one stroke at a time. Designed by me, built almost entirely with Claude Code.

A playful corner of the internet for learning kanji, one stroke at a time. Designed by me, built almost entirely with Claude Code.

日

日

日

月

月

月

木

木

木

火

火

水

水

水

見

見

  • 日

    day

  • 月

    moon

  • 水

    water

  • 山

    mountain

  • 人

    person

  • 火

    fire

  • 木

    tree

  • 見

    see

  • 行

    go

  • 時

    time

  • 学

    study

  • 雨

    rain

  • 友

    friend

  • 天

    heaven

  • 日

    day

  • 月

    moon

  • 水

    water

  • 山

    mountain

  • 人

    person

  • 火

    fire

  • 木

    tree

  • 見

    see

  • 行

    go

  • 時

    time

  • 学

    study

  • 雨

    rain

  • 友

    friend

  • 天

    heaven

名前

the name

The name, piece by piece

The name, piece by piece

The name, piece by piece

Kanji no Chikara is three small pieces of Japanese that add up to one big idea.

Kanji no Chikara is three small pieces of Japanese that add up to one big idea.

かんじ

漢字

漢字

漢字

kanji, Chinese characters

kanji, Chinese characters

+

no

の

の

の

possessive particle: “of”

possessive particle: “of”

+

ちから

力

力

力

strength, power

strength, power

= “the power of kanji”

= “the power of kanji”

物語

the story

Why it exists

Why it exists

Why it exists

一

What it is

A personal kanji reference with 2,211 characters from JLPT N5 to N1. Every kanji gets its own page with meanings, readings, stroke count, radical and example words.

一

What it is

A personal kanji reference with 2,211 characters from JLPT N5 to N1. Every kanji gets its own page with meanings, readings, stroke count, radical and example words.

一

What it is

A personal kanji reference with 2,211 characters from JLPT N5 to N1. Every kanji gets its own page with meanings, readings, stroke count, radical and example words.

二

The problem

Study apps bury kanji under streaks, scores and notifications. I just wanted to look at one character at a time, and actually enjoy it.

二

The problem

Study apps bury kanji under streaks, scores and notifications. I just wanted to look at one character at a time, and actually enjoy it.

二

The problem

Study apps bury kanji under streaks, scores and notifications. I just wanted to look at one character at a time, and actually enjoy it.

三

The fix

A calm, playful reference with no accounts and no tracking, designed and built almost entirely in conversation with Claude Code.

三

The fix

A calm, playful reference with no accounts and no tracking, designed and built almost entirely in conversation with Claude Code.

三

The fix

A calm, playful reference with no accounts and no tracking, designed and built almost entirely in conversation with Claude Code.

The details

The details

詳細

詳細

MY ROLE

Product Designer

Design Engineer

TOOLS

Claude Code

Figma

Framer

Next.js

Vercel

TIMELINE

Side project

PROCESS

Learn

Prompt

Design

Ship

機能

features

Every page, designed and built

Every page, designed and built

Every page, designed and built

Three core flows sharing one design language, and the thinking behind each.

Three core flows sharing one design language, and the thinking behind each.

一

SEARCH & EXPLORE

Find any of 2,211 kanji, three ways

Find any of 2,211 kanji, three ways

Find any of 2,211 kanji, three ways

Search by kanji, English meaning or kana reading, with 水, water and みず as hints. Or browse: filter by JLPT level, sort by frequency or strokes, and switch between cards and a compact grid.

Search by kanji, English meaning or kana reading, with 水, water and みず as hints. Or browse: filter by JLPT level, sort by frequency or strokes, and switch between cards and a compact grid.

Kanji, meaning or kana

Level filters & sorting

Cards / compact view

二

KANJI PAGE

One character, everything you need

One character, everything you need

One character, everything you need

Meanings, on’yomi and kun’yomi, an animated stroke order you can replay at 0.5×, 1× or 2×, common words, kanji that share its radical, and the next one in the level. Small ? explainers teach the jargon right where it comes up.

Meanings, on’yomi and kun’yomi, an animated stroke order you can replay at 0.5×, 1× or 2×, common words, kanji that share its radical, and the next one in the level. Small ? explainers teach the jargon right where it comes up.

Stroke-order player

Reading explainers

Same-radical links

Prev / next in level

三

SAVED & SOURCES

Honest by design

Honest by design

Honest by design

No account: favourites and recent kanji stay in your browser. Every dataset is credited with its licence and version, known limits are stated, and kanji without common example words show none rather than invented ones.

No account: favourites and recent kanji stay in your browser. Every dataset is credited with its licence and version, known limits are stated, and kanji without common example words show none rather than invented ones.

Saved, no sign-up

4 open datasets

Limits stated

遊び心

playfulness

Designing a kanji playground

Designing a kanji playground

Designing a kanji playground

Crimson, cream and round shapes everywhere. The goal was a study tool that feels more like a sticker book than a textbook.

Crimson, cream and round shapes everywhere. The goal was a study tool that feels more like a sticker book than a textbook.

Colour

色

紅

紅

Crimson

Crimson

#BD002A

#BE002D

桜

桜

Sakura

Sakura

#FDF0F3

#FCE8EE

紙

紙

Washi

Washi

#F5E6D3

#F4E5D3

墨

墨

Sumi

Sumi

#333333

#333333

Type

書体

Aa あ 漢

Aa あ 漢

Zen Maru Gothic + Nunito

Zen Maru for kanji and headings, Nunito for reading. Both rounded, both as happy in English as in Japanese.

字

Big friendly seals

Every kanji sits in a chunky round seal, so the character is always the hero.

リョク

ちから

Readings as soft pills

On’yomi and kun’yomi become little tappable pebbles instead of a dense table.

私

Cards that tilt

Cards sit slightly crooked, like flashcards scattered across your desk.

細部

the details

The details nobody asks for

The details nobody asks for

The details nobody asks for

The small things that separate a pretty mockup from a product people trust.

The small things that separate a pretty mockup from a product people trust.

読

Teach in place

? explainers for on’yomi, kun’yomi and radicals appear exactly where the question comes up, not in a help page.

大

Fluid type scale

Text sizes are clamp() steps, so headings and kanji scale smoothly from a small phone to a wide screen.

手

Accessible by default

A skip link, external links that say where they open (“opens jisho.org”) and visible focus states in the accent colour.

一緒に

together

Built with Claude Code

Built with Claude Code

Built with Claude Code

Almost every line of code came out of conversations with Claude Code: parsing the open dictionary data, generating every kanji page and tuning the playful UI. Figma and Framer filled in the gaps.

Almost every line of code came out of conversations with Claude Code: parsing the open dictionary data, generating every kanji page and tuning the playful UI. Figma and Framer filled in the gaps.

2,211

2,211

2,211

kanji pages

5

5

5

JLPT levels, N5 to N1

0

0

0

accounts, streaks or trackers

THE LOOP, ROUGHLY

idea

idea

→

prompt

prompt

→

review

review

→

refine

refine

↺ repeat until it feels right (and the kanji are correct)

↺ repeat until it feels right (and the kanji are correct)

一

Sketched the vibe in Figma and Framer: crimson, cream and lots of circles

Sketched the vibe in Figma and Framer: crimson, cream and lots of circles

二

Built every page and data step together with Claude Code

Built every page and data step together with Claude Code

三

Checked the details by hand, then shipped on Vercel

Checked the details by hand, then shipped on Vercel

一

歩

ず

つ

One stroke at a time

One stroke at a time

One stroke at a time

The result is a calm, playful space for learning kanji, and proof that a designer working with Claude Code can ship a real product end to end.

The result is a calm, playful space for learning kanji, and proof that a designer working with Claude Code can ship a real product end to end.