Inspeccione webkit-input-placeholder con herramientas de desarrollador

Es posible diseñar un marcador de posición de entrada de texto con lo siguiente:

-webkit-input-placeholder {
    color: red;
}

Estoy viendo un sitio web en línea y me gustaría usar el mismo color de marcador de posición que ellos. ¿Es posible averiguar qué color usaron? Me gustaría incluir cualquier valor alfa, por lo que no puedo simplemente muestrear el color con un editor de imágenes.

Cuando inspecciono el elemento con Chrome Dev Tools, veo:

Las herramientas de desarrollo no proporcionan información sobre el elemento de marcador de posición cuando se inspecciona el elemento de entrada. ¿Hay otra manera?

Me lo imaginé.

El truco consiste en habilitar 'Mostrar DOM de agente de usuario de sombra' en el panel de Configuración de Chrome Developer Tools:

Para acceder a la configuración, haga clic en el botón "⋮" en la parte superior derecha de su panel de Herramientas de desarrollo, luego haga clic en Configuración y se encuentra debajo de la pestaña Preferencias predeterminada.

Con eso, ahora puedes verlo:

1. Para Google Chrome versión 69:
2. Abra Inspeccionar elementos: en Mac ⌘ + Shift + C, en Windows / Linux Ctrl + Shift + C O F12.
3. Haga clic en el botón "⋮" en la esquina superior derecha y luego vaya a configuración
4. En la configuración, haga clic en Preferencias> Haga clic en Mostrar agente de usuario Shadow DOM

Las siguientes imágenes muestran el proceso:

Vaya a configuración> Preferencias:

Haga clic en Mostrar agente de usuario Shadow DOM:

Ver el CSS del marcador de posición: