如何为shinyWidgets::multiInput()组件设置可读的字体颜色？

我正在使用{shinyWidgets}包中的多选输入控件multiInput，但默认字体颜色可读性较差。以下是我的示例代码：

library(shiny)
library(shinyWidgets)
  
ui <- fluidPage(
  multiInput(inputId = "id", label = "Datasets:", choices = 1:5), 
  verbatimTextOutput(outputId = "res")
)

server <- function(input, output, session) {
  output$res <- renderPrint({ input$id })
}

shinyApp(ui = ui, server = server)

请问如何修改该控件的字体颜色？

要修改multiInput的字体颜色，你可以通过添加自定义CSS样式实现，该控件的外观由HTML和CSS控制，具体方案如下：

核心实现思路 #

通过CSS选择器定位multiInput内的不同文本元素，设置color属性调整字体颜色：

• 未选中的选项：.ms-choice span 和 .ms-drop ul li span
• 已选中的标签文本：.multi-input-container .label-info
• 标签的关闭按钮（可选优化）：.multi-input-container .label-info .close

修改后的完整代码 #

library(shiny)
library(shinyWidgets)
  
ui <- fluidPage(
  # 插入自定义CSS样式
  tags$style(HTML("
    /* 调整未选中选项的字体颜色 */
    .ms-choice span, .ms-drop ul li span {
      color: #2c3e50; /* 深灰色，可替换为任意需要的颜色值 */
    }
    /* 调整已选中标签的文本颜色 */
    .multi-input-container .label-info {
      color: #ffffff; /* 白色，搭配默认标签背景更清晰 */
    }
    /* 可选：优化标签关闭按钮的颜色 */
    .multi-input-container .label-info .close {
      color: #ffffff;
      opacity: 0.8;
    }
  ")),
  multiInput(inputId = "id", label = "Datasets:", choices = 1:5), 
  verbatimTextOutput(outputId = "res")
)

server <- function(input, output, session) {
  output$res <- renderPrint({ input$id })
}

shinyApp(ui = ui, server = server)

补充说明 #

• 颜色值支持十六进制、RGB、颜色名称等多种格式，可根据需求自由替换
• 如果仅需修改部分元素（比如只调整已选中标签），直接删除不需要的CSS规则即可

内容的提问来源于stack exchange，提问作者asog