• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

CSS Colur description

Scheduled Pinned Locked Moved Custom CSS
9 Posts 3 Posters 2.1k Views 2 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • B Offline
    broberg Project Sponsor @Vauxdvihl
    last edited by Nov 20, 2019, 8:49 AM

    @Vauxdvihl

    go to : https://rgbcolorcode.com/

    There you can pick the color you want and then you use the codes to the right
    0_1574239422834_coolorgef.jpg

    instead of using the color names

    color: red
    

    You can use Hexadecimal

    color: #FF0000
    

    Or RGB

    color: rgb(255,0,0)
    

    or RGBA (if you want the text to be translucent)

    color: rgba(255,0,0,0.8)
    

    (you can use many more, but these will do you just fine)

    1 Reply Last reply Reply Quote 2
    • V Offline
      Vauxdvihl
      last edited by Nov 20, 2019, 8:31 PM

      Thanks for the answer

      But the calendar ext 2 supports only 3 digits

      .CX2 .AbfallRest {
        background-color:#330;
        color:#FFF;
       }
      

      Any other Idea?
      Thanks

      B 1 Reply Last reply Nov 20, 2019, 9:11 PM Reply Quote 0
      • B Offline
        broberg Project Sponsor @Vauxdvihl
        last edited by Nov 20, 2019, 9:11 PM

        @Vauxdvihl …

        It’s not special in any way, it’s just css and it can take whatever the css standard does.
        So yes, it will take all the different options I wrote in my answer.

        The three digit HEX (#FFF) is just a shorter (and less exact) version of the six digit HEX, like this

        #FFF is the same as #FFFFFF
        #330 is the same as #333300

        But you can’t get exact colors, you can only get a rough version of the colors, the 3 digit HEX is limited in that regard.

        1 Reply Last reply Reply Quote 1
        • B Offline
          broberg Project Sponsor
          last edited by Nov 20, 2019, 9:13 PM

          here is a list over the different values you can use in any option with colors in css : https://www.w3schools.com/cssref/css_colors_legal.asp

          1 Reply Last reply Reply Quote 1
          • V Offline
            Vauxdvihl
            last edited by Nov 22, 2019, 7:05 PM

            @broberg
            Thanks a lot for your help
            but one question
            i want to have a “brown” like 8B 45 13
            What is here the 3 digit hex ;-)
            Thanks

            S B 2 Replies Last reply Nov 22, 2019, 8:04 PM Reply Quote 0
            • S Offline
              sdetweil @Vauxdvihl
              last edited by Nov 22, 2019, 8:04 PM

              @Vauxdvihl find a hex to decimal converter

              8b is 139

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              1 Reply Last reply Reply Quote 0
              • B Offline
                broberg Project Sponsor @Vauxdvihl
                last edited by broberg Nov 23, 2019, 9:15 AM Nov 23, 2019, 9:10 AM

                @Vauxdvihl just use that hex code, I don’t see why you would bother trying to use a three digit hex when you can’t get that color with just the three digit hex.

                Slap a # on it and be done. (#8B4513)

                And the closest three digit code is easily done by removing the second character in the pair.

                So
                8B would be 8
                45 would be 4
                13 would be 1

                But this will result in #884411 instead of #8B4513.

                1 Reply Last reply Reply Quote 0
                • V Offline
                  Vauxdvihl
                  last edited by Nov 23, 2019, 6:54 PM

                  @broberg
                  Thanks a lot
                  it is now clear

                  1 Reply Last reply Reply Quote 0
                  • 1 / 1
                  1 / 1
                  • First post
                    6/9
                    Last post
                  Enjoying MagicMirror? Please consider a donation!
                  MagicMirror created by Michael Teeuw.
                  Forum managed by Sam, technical setup by Karsten.
                  This forum is using NodeBB as its core | Contributors
                  Contact | Privacy Policy