What is TinaCMS?

TinaCMS is an open-source, Git-backed headless content management system (CMS). It allows you to craft a no-code editing experience on top of your website.

TinaCMS doesn't lock you into a proprietary database (e.g. WordPress, Contentful, Sanity, etc). With TinaCMS, you control your content like software developers control their code. The content is in the form of Markdown, MDX, and JSON files stored with the power of Git.

Continue on for a quick 2 minute rundown of TinaCMS, and how it fits in your website.

If you want to jump right in, head over to our Quickstart page.

Introduction

  • TinaCMS is an open-source Content Management System (CMS) that seamlessly integrates with your Markdown workflow.

Introduction
Your Website

  • With TinaCMS, The developer hosts the site where they like, using whichever framework they choose.

Your Website
Headless CMS

  • TinaCMS is "Headless", meaning it's decoupled from your website. TinaCMS provides a queryable content API that your website's code consumes.

Headless CMS

The CMS Backend

  • The TinaCMS backend provides the API for querying your content, offering support for filtering, searching, and pagination.

The CMS Backend
Git-Backed Content

  • All your content gets backed by git into JSON/Markdown/MDX files.

Git-Backed Content
TinaCloud

  • Out of the box, we provide an easy-to-use hosted version of the backend, called TinaCloud.

TinaCloud
Self-Hosted Backend

  • For those preferring more control and customization, TinaCMS also allows you to host the backend entirely on your own stack.

Self-Hosted Backend

The CMS Frontend

  • TinaCMS provides an intuitive CMS interface for your editors. For sites using React, TinaCMS supports "Visual Editing" to allow content editors to see real-time changes.

The CMS Frontend
/admin Route

  • Users interact with the CMS by navigating to the /admin page on your site.

/admin Route
Saving

  • When users make a change in the CMS, a commit is made back to your Git repository.

Saving

Integrating TinaCMS into a site

  • TinaCMS can be setup on your site with tinacms init. This installs a few Tina packages, and add some boilerplate.

Integrating TinaCMS into a site
Running TinaCMS Locally

  • You also have the flexibility to run TinaCMS locally, sourcing local files instead of interacting with the hosted API. This gives developers an ultra-fast feedback loop.

Running TinaCMS Locally
Content Modelling

  • Content in TinaCMS is modelled using a `tina/config.ts` file in your project. Through this, you can define "collections" that model various content types on your site.

Content Modelling
Data-Fetching

  • TinaCMS provides a GraphQL API, making data-fetching more efficient and powerful.

Data-Fetching
Client

  • Moreover, we also generate a user-friendly client that simplifies the process of querying your content.

Client
Type-Safety

  • TinaCMS emphasizes type safety, ensuring your content queries remain error-free and consistent, thus improving code reliability and maintainability.

Type-Safety
Last Edited: February 5, 2026
Next
Quickstart