{"id":1209,"date":"2024-07-31T12:08:13","date_gmt":"2024-07-31T10:08:13","guid":{"rendered":"https:\/\/blog.sutilweb.eu\/?page_id=1209"},"modified":"2024-07-31T12:08:13","modified_gmt":"2024-07-31T10:08:13","slug":"08-colores-css-hex","status":"publish","type":"page","link":"https:\/\/sutilweb.eu\/index.php\/lenguajes\/css3\/css3-basico\/08-colores-css-hex\/","title":{"rendered":"08. Colores CSS HEX"},"content":{"rendered":"\n

Un color hexadecimal<\/strong> se especifica con: #RRGGBB, donde los enteros hexadecimales RR (rojo), GG (verde) y BB (azul) especifican los componentes del color. En CSS<\/strong>, se puede especificar un color usando un valor hexadecimal<\/strong> en la forma:<\/p>\n\n\n\n\n\n\n\n

#rrggbb<\/em><\/pre>\n\n\n\n
Donde rr<\/em> <\/strong>(rojo), gg<\/em> <\/strong>(verde) y bb<\/em> <\/strong>(azul) son valores hexadecimales entre 00<\/em> <\/strong>y ff<\/em> <\/strong>(igual que decimal 0-255). Por ejemplo, #ff0000<\/em> <\/strong>se muestra en rojo, porque el rojo se establece en su valor m\u00e1s alto (ff<\/em><\/strong>) y los dem\u00e1s se establecen en el valor m\u00e1s bajo (00<\/em><\/strong>). Para mostrar negro, establezca todos los valores en 00, as\u00ed: #000000<\/em><\/strong>. Para mostrar blanco, establezca todos los valores en ff<\/em><\/strong>, as\u00ed: #ffffff<\/em><\/strong>.<\/p>\n\n\n\n
Tonos de grises<\/h2>\n\n\n\n
Los tonos de gris a menudo se definen utilizando valores iguales para las 3 fuentes de luz.<\/p>\n\n\n\n
Ejm<\/strong><\/p>\n\n\n\n
<!DOCTYPE html>\n<html>\n<body>\n\n<h1>Shades of gray<\/h1>\n\n<p>By using equal values for red, green, and blue, you will get \ndifferent shades of gray:<\/p>\n\n<h2 style=\"background-color:#3c3c3c;\">#3c3c3c<\/h2>\n<h2 style=\"background-color:#616161;\">#616161<\/h2>\n<h2 style=\"background-color:#787878;\">#787878<\/h2>\n<h2 style=\"background-color:#b4b4b4;\">#b4b4b4<\/h2>\n<h2 style=\"background-color:#f0f0f0;\">#f0f0f0<\/h2>\n<h2 style=\"background-color:#f9f9f9;\">#f9f9f9<\/h2>\n\n<\/body>\n<\/html><\/pre>\n\n\n\n
C\u00f3digo hexadecimal de 3 d\u00edgitos<\/h2>\n\n\n\n
A veces ver\u00e1 un c\u00f3digo hexadecimal<\/strong> de 3 d\u00edgitos en la fuente CSS. El c\u00f3digo hexadecimal<\/strong> de 3 d\u00edgitos es una forma abreviada de algunos c\u00f3digos hexadecimales de 6 d\u00edgitos. El c\u00f3digo hexadecimal de 3 d\u00edgitos tiene la siguiente forma:<\/p>\n\n\n\n
#rgb<\/em><\/pre>\n\n\n\n
Donde r<\/em><\/strong>, g<\/em><\/strong> y b<\/em><\/strong> representan los componentes rojo, verde y azul con valores entre 0<\/em><\/strong> y f<\/em><\/strong>. El c\u00f3digo hexadecimal de 3 d\u00edgitos solo se puede usar cuando ambos valores (RR<\/em><\/strong>, GG<\/em> <\/strong>y BB<\/em><\/strong>) son iguales para cada componente. Entonces, si tenemos #ff00cc<\/em><\/strong>, se puede escribir as\u00ed: #f0c<\/em><\/strong>.<\/p>\n\n\n\n
Ejm<\/strong><\/p>\n\n\n\n
body {\n  background-color: #fc9; \/* same as #ffcc99 *\/\n}\n\nh1 {\n  color: #f0f; \/* same as #ff00ff *\/\n}\n\np {\n  color: #b58; \/* same as #bb5588 *\/\n}<\/pre>\n","protected":false},"excerpt":{"rendered":"
Un color hexadecimal se especifica con: #RRGGBB, donde los enteros hexadecimales RR (rojo), GG (verde) y BB (azul) especifican los […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":563,"menu_order":7,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1209","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Sutil Web","author_link":"https:\/\/sutilweb.eu\/index.php\/author\/sutilweb\/"},"uagb_comment_info":0,"uagb_excerpt":"Un color hexadecimal se especifica con: #RRGGBB, donde los enteros hexadecimales RR (rojo), GG (verde) y BB (azul) especifican los […]","_links":{"self":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/1209","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/comments?post=1209"}],"version-history":[{"count":1,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/1209\/revisions"}],"predecessor-version":[{"id":1210,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/1209\/revisions\/1210"}],"up":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/563"}],"wp:attachment":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/media?parent=1209"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}