Style Reference
Brief overview of styles used in this css. Best viewed on desktop. Mobile view coming soon.

Jump to
  • Typography
    •
  • Color
    •
  • Grid
    •
    Typography
    The font family is Degular in 500 weight across all styles. Available via Adobe Typekit.

    Header 1

    font-size 56pt
    line-height 1.2em
    letter-spacing -0.02em

    Header 2

    font-size 36pt
    line-height 1.1em
    letter-spacing -0.01em

    Header 3

    font-size 24pt
    line-height 1.1em
    letter-spacing -0.01em

    Header 4

    font-size 18pt
    line-height 1.1em
    letter-spacing -0.01em
    Header 5
    font-size 14pt
    line-height 1.2em
    letter-spacing 0em

    Paragraph

    font-size 18pt
    line-height 1.5em
    letter-spacing -0.01em

    Caption

    font-size 12pt
    line-height 1.1em
    letter-spacing -0.02em
    Color
    Light tan
    HEX#FFFBF6
    RGB255, 251, 246
    VAR--tan
    Grey
    HEX#A7A7A7
    RGB167, 167, 167
    VAR--grey
    Soft black
    HEX#424242
    RGB66, 66, 66
    VAR--black
    Highlight
    HEX#FF9C21
    RGB255, 156, 33
    VAR--hlight
    Grid
    Contents displayed as a grid inhabit a responsive 6-column layout. Row and column gaps are 25px.
    1 fr
    1 fr
    1 fr
    1 fr
    1 fr
    1 fr
    2 fr
    2 fr
    2 fr
    3 fr
    3 fr
  • Tags

  • HTML

  • CSS

  • Project Background

    • I've had an interest in learning html and css and finally put effort toward this. Everything viewable at https://jesslikes.work is displayed with custom html and css.

  • Challenge

    • Squarespace has been my chosen provider for a long time because it has nice template options and is friendly for people who don't code. However, there are limits to how I can customize my webpage and it is quite costly.

  • Solution

    • I learned and practiced html and css by reading tutorials and building my design from scratch in github. Afterwards, I transferred my code to Squarespace as custom html and css with minor adjustments. I still rely on Squarespace for other features, though this practice may open new possibilities for me to host my work elsewhere soon.