0
251
Views¿Puedo encontrar el esquema de color en el navegador?
ya que es posible averiguar si la PC está en modo oscuro o no, me gustaría saber si es posible averiguar qué combinación de colores ha tomado el usuario, por ejemplo, amarillo, verde, naranja, azul, púrpura, violeta. Debido a que me gustaría crear una página web que se adapte de acuerdo con el esquema de color establecido, en el mejor de los casos, los valores de color exactos serían buenos.
1 answers
Answer question0
Según las especificaciones, puede usar los colores del sistema . Por ejemplo, el fondo predeterminado del sistema sería Canvas , que puede usar así: background-color: Canvas .
El soporte no siempre es excelente, pero eso es lo que estás buscando.
Alternativamente, también puede mirar las hojas de estilo del agente de usuario (valores predeterminados del navegador). Por ejemplo, el de safari define algunas variables CSS como -apple-system-opaque-secondary-fill o -webkit-control-background .
Para más información sobre todo esto, hay este gran artículo
Si necesita obtener los valores de estos colores en CSS, siempre puede hacerlo así:
function getRgbForColorName(name) { const d = document.createElement("div") d.style.color = name document.body.appendChild(d) const rgb = window.getComputedStyle(d).color document.body.removeChild(d) return rgb } console.log('Canvas:', getRgbForColorName('Canvas')) console.log('Highlight:', getRgbForColorName('Highlight'))Probablemente haya una forma más limpia de hacer esto. Esto es solo una prueba de concepto. Vea esta respuesta: Función Javascript para convertir nombres de colores a códigos hexadecimales .
En MacOS, el "color" que puede configurar el usuario es SelectedItem , que Chrome no reconoce.