Hatch Theme: CSS to change font boldness and color on primary header menu

  • Author
  • #1220887

    Hi! I would like to change the color and how strong/bold the font is on the Hatch Theme primary header menu.

    Here is my blog:

    I have the CSS customize upgrade and would like the CSS code to adjust the font. I like the font choices provided by WP however this theme seems to automatically make the font chunky/bold and I am unable to change that. I’d like the font to be more delicate (not boldface).

    Also, it seem to automatically darken the color of the font color that I choose. Eg., if I choose bright green, it automatically becomes darker green. I would like the CSS to just have the color that I want (CCFF66).

    The bold font and darkened/muted color seem to be of the same function, but if they are separate CSS issues, I’d like the code to change both.

    No bold type in header menu
    Straight color without muting in header menu.

    The blog again is: http://teaandtype.wordpress.com

    Any help is MUCH appreciated! Thanks!

    The blog I need help with is teaandtype.wordpress.com.


    The first bit changes the font weight from bold back to normal. I included a font size declaration since in my opinion the font size is a touch too small. I did 120%, but you can adjust that as you see fit, or delete that declaration if you are happy with the existing font size.

    The second bit is the color for the “current” page menu item.

    The third bit is the non-current menu items (currently the green). Edit the color codes as you desire.

    .main-navigation a {
    font-weight: normal;
    font-size: 120%;
    .main-navigation li.current_page_item a, .main-navigation li.current-menu-item a {
        color: #000000;
    .main-navigation a {
        color: #4E780B;

    This is very helpful. Thank you so much!!!


    You are welcome.

The topic ‘Hatch Theme: CSS to change font boldness and color on primary header menu’ is closed to new replies.