It looks like Ink uses h1 tags, so normal Markdown may be supported.
If not, you can probably do it with CSS.
How to change fonts and colours
Fonts and colours are all controlled from the CSS file - style.css . If you open up the file, you’ll see a series of blocks like this one:
font-family: 'Open Sans', sans-serif;
Each one starts with a name like “body” or “h1”. In CSS this is called a selector since it selects a particular part of the webpage for styling. In the above case it selects the body, which is effectively the entire page.
The list of fonts following
font-family is in priority order; it depends on what’s available on the user’s computer. In the above example Open Sans is a web font that’s imported at the top of the file - just visit fonts.google.com for a selection to choose from, and instructions on how to use them (it gives you one of those
@import lines you can paste in yourself). If for some reason this font can’t be downloaded, it’ll fall back to the
You can also use a font that’s built into the user’s system, but the problem is that there’s a very limited selection that are guaranteed to exist. The very most basic fallbacks can be specified using simply
A few of the CSS selectors and rules in the file include:
h1 - this stands for “header level 1” - i.e. the largest header, which is used for the main title of the story at the top of the page. If you wanted change the size of the title, you could change the
font-size property in here. Similarly the
h1, h2 is a shortcut for setting rules on two selectors at once - header levels 1 and 2. The later is used for the byline if you have an
# author: Your Name tag at the top of your ink.
.header - A name preceeded by a dot is a class name. This particular example selects an element that’s simply a container for the title and byline. Often in HTML/CSS, elements are given containers to help with structuring or to give fine control over spacing and layout.
p - this stands for “paragraph”. It’s the selector for the main body text on the page. So this is where you should look if you want to change the font size, text colour, etc.
a - This stands for anchor tag , which is HTML terminology for clickable link - these are mostly just used on our page for clickable choices, but could be anything.
p.choice - This translates to “a paragraph with the ‘choice’ class”. If it was just
.choice , it would mean “anything with a choice class”. Choices on our page are actually structured as specially styled paragraphs that contain clickable links (anchor tags).