Option to add custom CSS for the table

The opt_css() function makes it possible to add CSS to a gt table. This CSS will be added after the compiled CSS that gt generates automatically when the object is transformed to an HTML output table. You can supply css as a vector of lines or as a single string.

Usage

opt_css(data, css, add = TRUE, allow_duplicates = FALSE)

Arguments

data: A table object that is created using the gt() function.
css: The CSS to include as part of the rendered table's <style> element.
add: If TRUE, the default, the CSS is added to any already-defined CSS (typically from previous calls of opt_table_font(), opt_css(), or, directly setting CSS the table.additional_css value in tab_options()). If this is set to FALSE, the CSS provided here will replace any previously-stored CSS.
allow_duplicates: When this is FALSE (the default), the CSS provided here won't be added (provided that add = TRUE) if it is seen in the already-defined CSS.

Value

An object of class gt_tbl.

Examples

Use exibble to create a gt table and format the data in both columns. With opt_css(), insert CSS rulesets as as string and be sure to set the table ID explicitly (here as "one").

exibble %>%
  dplyr::select(num, currency) %>%
  gt(id = "one") %>%
  fmt_currency(
    columns = currency,
    currency = "HKD"
  ) %>%
  fmt_scientific(
    columns = num
  ) %>%
  opt_css(
    css = "
    #one .gt_table {
      background-color: skyblue;
    }
    #one .gt_row {
      padding: 20px 30px;
    }
    #one .gt_col_heading {
      text-align: center !important;
    }
    "
  )

This image of a table was generated from the first code example in the `opt_css()` help file.

Function ID

9-11