You won't find exactly "how to change website direction in Gatsby" because, as any other web framework, this kind of customization belongs to CSS (or other preprocessed files such as SCSS).

You can find extensive documentation about built-in styling support at: https://www.gatsbyjs.com/docs/how-to/styling/built-in-css/

You must not customize the index.html (which is placed in the public folder) because it is generated in each build, so if you change something in it, as soon as you build your site again, your changes will be lost.

Your best chance is using global styles, which you can also find documentation at: https://www.gatsbyjs.com/docs/creating-global-styles/

For example:

import React from "react"
import "./layout.css"

export default function Layout({ children }) {
  return <div>{children}</div>
}

And in your layout.css:

div {
  background: red;
  color: white;
  direction: rtl;
}