• 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.0k 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.
  • V Offline
    Vauxdvihl
    last edited by Nov 19, 2019, 8:36 PM

    Hi friends,

    i have a simple question.
    I am using @Sean calendarext2 module and i want to change some colors
    Currently i am using as a reference this page here:
    https://wiki.selfhtml.org/wiki/Grafik/Farbpaletten

    But i want to have a grey and a brown.
    I do not find these ones in the above standing link

    Can please somebody help me

    Thanks a lot

    B 1 Reply Last reply Nov 20, 2019, 8:49 AM Reply Quote 0
    • 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 Away
                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
                      4/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