User style to modify new Twitter to eliminate snow-blindness

http://userstyles.org/ allows you to modify webpages.

It is available for Firefox and Chrome. I have only tested the style below on Firefox desktop. My style tones-down the white background and makes other changes to make twitter easier on the eye.

Install the Stylish addon then write a new style via pasting everything below (starting at @namespace) into your new style. If you want a different background color, change the top three color entries (#E3E3E3) to the color of your choice. Check back here for future updates. Tweet questions to @2045singularity.

If anything looks wonky let me know. 17th May 2014.

I will not be updating this pastebin version any more.

See latest version at:

http://userstyles.org/styles/101446/twitter-easy-eye-no-white-background


@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document regexp("http(s)?://([^.]*\\.|)twitter\\.com/(?!widget).*")

{

    /*Singularity Utopia Style ---- @2045singularity */

html, body, #doc, #page-outer

    {
        background: #E3E3E3;

    }

.Grid--withGutter
    {
       background: #E3E3E3;

    }

.ProfileHeaderCard-screennameLink:hover
    {
        background: #E3E3E3 !important;
        box-shadow: none !important;
    }

.ProfilePage .AppContent
    {
        background: none;

    }

.ProfileCanopy-navBar

    {
        background: none;

    }

.ProfileNav-item--userActions
    {
        background: none;
    }



.ProfileTweet
    {
        transition: all 0.5s ease-in-out;
        border-color: #C5CFD7;
        border-style: solid;
        border-width: 1px 1px 2px 1px;
        border-radius: 3px 3px 5px 5px !important;
        margin: 5px 0 5px 0 !important;
    }

.ProfileTweet:hover
    {
        border-color:#A8A7B5;
        box-shadow:#A5A4B3 0px 1px 7px;
    }


.StreamToggler
    {
        border: none;
        padding-bottom:4px;
    }

.Container
    {
        background: white;
    }

#widget

    {
        background:none;
    }


.ProfileCard
    {
        border: 1px solid #CACBD2;
        background-color: #FFF2E3;
        border-radius: 4px 4px 12px 12px;
        border-bottom-width:2px;
        margin-bottom:6px;

    }

.ProfilePage
    {
        min-width:900px;
        max-width:998px;
        margin: 0 auto auto auto;
    }

.global-nav-inner
    {
        background: none repeat scroll 0% 0% #F0ECE1;
        box-shadow: inset white 0px 0px 3px 0px, rgba(34, 34, 34, 0.2) 0px 0px 20px;
    }


A.StreamToggler-link.u-textUserColor.js-nav
    {
        margin-top:5px;
    }


/* TWEETS - TWEETS AND REPLIES  */

.ProfileHeading-toggleItem
    {
        margin-right: 15px !important;

    }

.ProfileHeading-toggleItem.is-active

    {
        border-bottom: 3px solid #CFCFCF;
        border-radius: 20px 22px 4px 19px;
        background: #EDEDED;
        padding: 15px 15px 15px 15px;
        margin-right: 15px;
        margin-bottom:10px !important;
        transition: all 0.3s ease-in-out;
    }


.ProfileHeading-toggleItem.is-active:hover

    {

        border-radius: 22px 20px 19px 4px;

        color:#514970;

    }

.ProfileHeading-content

    {
        background:none !important;
        border:none;
    }

.ProfileHeading-toggleItem.u-textUserColor.js-nav
    {
        transition: all 0.2s ease-in-out;
        padding: 15px;
        border-radius: 13px 17px 4px 13px;
        margin: 3px 5px 7px 0px;
        border-bottom: 3px solid transparent;
    }

.ProfileHeading-toggleItem.u-textUserColor.js-nav:hover
    {
        background: #FFFBE3;
        color:darkblue !important;
        box-shadow: inset white 0px 0px 1px, lightgrey 0px 2px 8px;
        border-bottom: 3px solid #B1AEBD;
    }

.ProfileHeading-toggleItem.u-textUserColor.js-nav:active
    {
        background: #FFE2B3;
         border-bottom: 3px solid orange;
    }

.ProfileHeading-toggleItem.u-textUserColor.js-nav:focus
    {
        background: #FFE2B3;
        border-bottom: 3px solid orange;
    }

.ProfileNav-item.is-active .ProfileNav-stat, .ProfileNav-stat:hover, .ProfileNav-stat:focus
    {
        border-radius: 0px;
        background: #fff;
    }

#global-actions A.js-nav:hover
    {
        background: #EBF4FF;
        box-shadow: inset #fff 0px 0px 0px 1px;
    }

.ProfileNav-stat--link:hover, .ProfileNav-stat--link:focus

    {
        background: #EBF4FF;
        box-shadow: inset #fff 0px 0px 0px 1px;
    }

.ProfileNav-stat--moreLink:hover, .ProfileNav-stat--moreLink:focus
    {
        margin-top: 7px;
        padding-top:7px;
        background:#FFFBE3;
        border-radius: 15px !important;
    }

A.ProfileHeaderCard-nameLink.u-textInheritColor.js-nav:hover
    {
        background:none;
        color:grey !important;
        transition: all 0.5s ease-in-out;
        box-shadow:none !important;
    }

.GridTimeline-footerIcon
    {
        background-color: #F5F8FA;
        padding: 8px 5px 2px 14px;
        border-radius: 20px;
    }

.GridTimeline-footer:before

    {
        background:none;
    }


.ProfileCanopy-header.u-bgUserColor
    {
        border-radius: 0px 0px 8px 8px !important;
    }

.btn:hover
    {
        box-shadow: white 0px 0px 1px 0px;
    }

#global-new-tweet-button:hover
    {
        border: 1px solid transparent !important;
        border-radius:2px;
    }

.tweet-btn:hover, .tweet-btn:active, .tweet-btn.active

    {
        border:1px solid transparent !important;
    }

.btn:hover, .follow-combo.open .btn-user-actions, .dropdown.open .user-dropdown
    {
        border-color: #8FD0FF;
    }

A.js-nav.js-initial-focus
    {
        background:none;
    }

A.account-group.js-account-group.js-action-profile.js-user-profile-link.js-nav
    {
        background:none !important;
    }

.u-bgUserColorLightest
    {
        background: #F5EEE4 !important;
        border-color:#CCCCCC !important;
        box-shadow: inset #F5EEE4 0px 0px 12px 13px;
    }


.ProfileTweetbox

    {
        background: #F5EEE4 !important;
    }

#page-container  .content:hover
    {
        background: none !important;
    }

/* NUMBER OF NEW TWEETS - 10etc new Tweets - notifications too  */

.new-tweets-bar
    {
        font-size: 13pt;
        font-weight: bold;
        word-spacing:5px;
        letter-spacing:1px;
        background: #F5F2EB;
        padding: 14px 0px 13px 0px;
        border-color: #E0E0E0;
        font-family:arial;
        text-shadow: white 0px 0px 1px;
        transition: all 0.05s ease-in-out;
        color: #CC0003;
        font-style:italic;
    }

.new-tweets-bar:hover

    {
        background: #BBEDCA;
        border-color: #ABD9B9;
        color: #001866;
    }


.new-tweets-bar:active

    {
        background: #FFE4A8;
        border-color: #EDCA9A;
        color: #470024;
    }


.stream

    {
        box-shadow: #BFBFBF 0px 60px 30px -40px;
    }

/* COG DROP */


.small-user-dropdown

    {
        margin-right:-1px !important;
        padding: 0 2px 0 5px !important;

    }

.small-user-dropdown:hover

    {
        background: #fff !important;
        border-radius:2px !important;
    }

.UserActions .user-dropdown
    {
        color: #2D648F;
        transition: all 0.4s ease-in-out;
        margin: 1px 11px 0px 0px;
        padding: 0 3px 0 8px;
        border: 1px solid transparent;
    }

.UserActions .user-dropdown:hover
    {
        color: #CF003B;
        background:#FFF9CF;
        box-shadow: #A3A3A3 0px 0px 1px 0px, lightgrey 0px 0px 1px 0px;

    }

.ProfileSidebar .Footer-item, .ProfileSidebar .Footer-link
    {
        color: #3B3F63;
    }

.ProfileClusterFollow

    {
        background:none;
        border:none;
    }

.ProfileClusterFollow-closeButton

    {
        padding:8px 18px 8px 18px;
        margin-top: -11px;
        border-radius: 7px;
        background: white;
        border:1px solid #9FA8CC;

    }

.ProfileClusterFollow-closeButton:hover
    {
        background: #B0FFDB;
        box-shadow:#BCD1CE 0px 2px 4px;
        border-color: grey;
    }

.ProfileClusterFollow-header
    {

        padding: 0px 33px 0px 0px;

    }

.primary-btn:hover

{

      border-color: transparent !important;

}

.primary-btn.retweet-action:focus

    {
        box-shadow: inset blue 0px 0px 1px 0px;

    }

.related li

    {
        border: 1px solid #CECECE;
        border-radius: 8px;
        background: white;

    }

}

/* include this too so you are sure you have not missed anything, the end. */