Lumekara
IDEN
All projects
Content and SEO

Blog with Formulas and Illustrations

An MDX education blog with crisp maths formulas, vector illustrations, a table of contents, RSS, and a call to action after each article.

Status
Live
Layers
FrontendAutomation
Used by
Students, parents, and teachers looking up maths topics on Google.
Ask about this project
A Numekara blog article on the volume and surface area of solids, with a table of contents
Screenshot

The problem

Articles with formulas often show blurry images or broken text, which hurts readability and search ranking.

The solution

Formulas render as text with KaTeX, illustrations are generated from TikZ into SVG, and cover images are created automatically. Each article ends with a call to practice, a course, or a consultation.

How it works

What happens, step by step, from the user's point of view.

  1. 01

    The writer drafts an MDX article

    Articles are written as plain text with formulas inside, then stored alongside the website code.

  2. 02

    Illustrations drawn from code

    Pictures such as graphs and shapes are written in TikZ, and a script turns them into sharp SVG images.

  3. 03

    Covers are made automatically

    A script creates a cover image with the title and main illustration, used when the article is shared.

  4. 04

    The reader opens the article

    Formulas display as crisp text through KaTeX, with a table of contents to jump to any section.

  5. 05

    A topic-matched call to action

    Each article ends with a fitting next step: tutoring, self-study practice, or a free consultation when no product fits.

System design

Who uses it, what they see, what works behind the scenes, and where the data lives. Read it from left to right.

  1. 1People

    • WriterWrites the articles and the source for their pictures.
    • ReadersArrive from Google, social media, or RSS.

  2. 2What they see

    • Article listArticle cards with cover image and category.
    • Article pageFormulas, illustrations, table of contents, and a closing call to action.

  3. 3Behind the scenes

    • MDX processorTurns article text into a page; formulas are rendered by KaTeX.
    • Image scriptsConvert TikZ into SVG and generate cover images.

  4. 4Where data lives

    • Article folder35 MDX articles stored with the website code.
    • RSS feedA list of the latest articles for news reader apps.

Key features

  • Crisp formulas with KaTeX
  • SVG illustrations from TikZ
  • Automatic table of contents
  • RSS feed
  • Topic-matched calls to action

Built with

  • Next.js
  • MDX
  • KaTeX
  • LaTeX
  • TikZ

Numbers you can check

35
MDX articles

What the business gets

  • Formulas stay sharp and easy to read on a phone.
  • Pages are friendlier to search engines because formulas are text, not blurry images.
  • Every article points readers to a relevant next step.
  • Social media cover images don't need to be designed by hand.

Terms on this page

MDX
A text format like an ordinary document that can include website components, such as a formula box.
KaTeX
A tool that shows maths formulas as crisp text in the browser.
TikZ
A language for drawing maths illustrations with text commands.
SVG
A line-based image format that stays sharp when zoomed in.

Can it work for your business?

For technical, education, or finance businesses that need an SEO blog where formulas, tables, and diagrams stay tidy.

Ask about this project