s i t e s ⠀ i ⠀ u s e ⠀ !
– – – – – – –⠀ ⠀I m a g e s⠀ ⠀– – – – – – –
⠀
Gradient Map⠀✦⠀Background remover
Gradient Image⠀✦⠀Blur edges⠀✦⠀Splitter
Image corner rounder⠀✦⠀ Gif corner rounder
– – – – – – –⠀ ⠀T e x t⠀ ⠀– – – – – – –
⠀
Metatags⠀✦⠀Fontspace⠀✦⠀Picsart
Superscript⠀✦⠀Rentry text gradient
Gradient generator⠀✦⠀Fontsensei
– – – – – – –⠀ ⠀M i s c⠀ ⠀– – – – – – –
– – – – – – – – – – – – – – – – – – – – – – – – – – –
t e x t ⠀ m e t a d a t a ⠀ !
⠀
– – – – – – – – – – – – – – – – – – – – – – – – – – –
Full guide on /metadata-how
– – – – – – – – – – – – – – – – – – – – – – – – – – –
-
Two fonts can be used for paragraph and headings
|⠀ CONTENT_FONT = Spectral Sancreek
-
Aside from text size, font weight for both paragraph and headings can be customized
|⠀ CONTENT_FONT_WEIGHT = 300 100
-
Two text colors can be used, for light and dark mode (as well as background and bullet colors)
|⠀ CONTENT_TEXT_COLOR = #656285 #e0d3bc
|⠀ CONTENT_BULLET_COLOR = #ffc4c4 #f2e3d5 -
Size of each text type can be customized.
|⠀ CONTENT_TEXT_SIZE = 16px 1rem 2.5rem 2rem 1.75rem 1.5rem 1.25rem 1rem 1rem 1rem 1rem 14px
—⠀ Type order = Base , Paragraphs , Header 1 , Header 2 , Header 3 , Header 4 , Header 5 , Header 6 , List , Link , Quotes , Code
—⠀ 1rem is 1x of the base text size. This is so that it is easier to control and keep the ratio of text and header sizes while only changing the base size. You can still use pixels or percentages instead of rem.
-
Link behavior, whether it opens on the same or new tab. for 1: internal (rentry links) and 2: external links
|⠀ CONTENT_LINK_BEHAVIOR = same new
-
Shadow for text
|⠀ CONTENT_TEXT_SHADOW_COLOR = #242424
|⠀ CONTENT_TEXT_SHADOW_OFFSET = 0px 0px
|⠀ CONTENT_TEXT_SHADOW_BLUR = 10px
– – – – – – – – – – – – – – – – – – – – – – – – – – –
Other customizable stuff I'd like to list
- Custom radius for each corner
- Custom border color, style, and width for each side
- Custom padding size for each side of container
⠀
– – – – – – – – – – – – – – – – – – – – – – – – – – –