Title: How to set borders color
Last modified: January 26, 2026

---

# How to set borders color

 *  Resolved [mstudioIL](https://wordpress.org/support/users/mstudioil/)
 * (@mstudioil)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/)
 * I want to change the border color, it show as “1px solid hsla(0,0%,7%,.11)” I
   can use CSS to be, but there is large number of classes to change, some for border
   top, some for border bottom and some for full border
 * How can I know what are these classes? Is the list of them?

Viewing 10 replies - 1 through 10 (of 10 total)

 *  Plugin Support [LovingBro (woo-hc)](https://wordpress.org/support/users/lovingbro/)
 * (@lovingbro)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18798720)
 * Hi [@mstudioil](https://wordpress.org/support/users/mstudioil/),
 * I understand what you are trying to achieve here, dealing with border styles 
   spread across multiple elements can feel overwhelming, and I am keen to help 
   you approach this in a cleaner and more manageable way.
 * In WooCommerce and modern WordPress themes, those border values like `1px solid
   hsla(0,0%,7%,.11)` are usually applied through shared utility classes or inherited
   styles rather than a single master list you can edit. The most reliable way to
   identify exactly which classes are affecting a specific border is to use your
   browser’s developer tools. When you right click on the element and choose Inspect,
   you will be able to see the exact CSS rule and class responsible for that border,
   including whether it is applied to the full border or only top or bottom. This
   helps you target only the necessary selectors instead of changing many classes
   blindly.
 * In many cases, you can override all related borders more efficiently by targeting
   a higher level wrapper or using a more generic selector, for example applying
   a border color override to WooCommerce table elements, form fields, or card containers,
   depending on where you see the borders. This reduces the need to handle each 
   individual border class separately.
 * If you would like more context on using browser dev tools to trace and override
   CSS safely, this guide walks through the process clearly and is a good reference
   to keep handy: [https://developer.wordpress.org/advanced-administration/debug/debug-wordpress/](https://developer.wordpress.org/advanced-administration/debug/debug-wordpress/).
 * If you can share a specific page or element where the border appears, or a screenshot
   using [https://snipboard.io](https://snipboard.io/), I can help you narrow down
   the exact selector to use so the change stays clean and future proof.
 *  Thread Starter [mstudioIL](https://wordpress.org/support/users/mstudioil/)
 * (@mstudioil)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18799501)
 * Hey, it is trthe card and checkout pages
 * How the “debug” will help me find the CSS? I can find them with the “inspect”
   tool but the there is many of them
 *  Plugin Support [shahzeen(woo-hc)](https://wordpress.org/support/users/shahzeenfarooq/)
 * (@shahzeenfarooq)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18799505)
 * Hi there,
 * Thanks you for the update. The styling of the cart and checkout pages is usually
   controlled by the theme or plugin you’re using on your site.
 * If you’re not sure which CSS class to use for styling a border, you can share
   your cart page URL and let us know exactly where you want the border to appear.
   We can help point you in the right direction for the correct CSS. Please note,
   though, that adding or customizing CSS is outside the scope of WooCommerce support.
 * The easiest and safest way to make style changes is often to contact your theme
   support team, as they can guide you on the best way to change the border color
   or other styling in your theme.
 *  Thread Starter [mstudioIL](https://wordpress.org/support/users/mstudioil/)
 * (@mstudioil)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18799581)
 * Classes are like “.wc-block-cart__main .wc-block-cart-items” these not your classes?
 *  [Sai (woo-hc)](https://wordpress.org/support/users/saivutukuru/)
 * (@saivutukuru)
 * [2 months, 1 week ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18799586)
 * Hi [@mstudioil](https://wordpress.org/support/users/mstudioil/),
 * Those classes, like `.wc-block-cart__main` and `.wc-block-cart-items`, are part
   of **WooCommerce Blocks, **so yes, they are WooCommerce’s default classes for
   cart and checkout blocks.
 * As mentioned earlier, changing borders on these elements requires CSS customization.
   There isn’t a single “list” of all border classes; many are applied to different
   elements, and some are inherited from parent wrappers.
 * The best approach is:
    1. **Use your browser’s Inspect tool** to find the exact element you want to style.
    2. **Target the relevant wrapper or element** in your CSS (for example, `.wc-block-
       cart__main .wc-block-cart-items { border-color: #yourcolor; }`).
    3. If you want to change multiple borders at once, you can target a higher-level
       wrapper to override borders globally for that section instead of styling each
       class individually.
 * Since CSS customization is theme/plugin dependent, WooCommerce support cannot
   provide full styling guidance. If you need more control, your theme support or
   a front-end developer can help ensure changes are clean and future-proof.
 *  Plugin Support [thelmachido a11n](https://wordpress.org/support/users/thelmachido/)
 * (@thelmachido)
 * [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18805532)
 * It’s been a while since we heard back from you for this reason we are closing
   this thread. 
 * If WooCommerce has been useful for your store and you appreciate the support 
   you’ve received, we’d truly appreciate it if you could leave us a quick review
   here: 
 *  [https://wordpress.org/support/plugin/woocommerce/reviews/#new-post](https://wordpress.org/support/plugin/woocommerce/reviews/#new-post)
 * Feel free to open a new forum topic if you run into any other problem. 
 *  Thread Starter [mstudioIL](https://wordpress.org/support/users/mstudioil/)
 * (@mstudioil)
 * [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18805550)
 * OK. thanks. this not fix the problem.
 *  [Sai (woo-hc)](https://wordpress.org/support/users/saivutukuru/)
 * (@saivutukuru)
 * [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18805669)
 * Hi [@mstudioil](https://wordpress.org/support/users/mstudioil/),
 * Those classes (for example, `.wc-block-cart__main`, `.wc-block-cart-items`) are
   part of **WooCommerce Blocks**, but WooCommerce does not provide a single list
   of border classes. Borders are applied to multiple elements and can also come
   from the active theme, which is why you’re seeing many selectors in Inspect.
 * Identifying and overriding the exact borders using custom CSS is considered **
   theme-level customization**, which is outside the scope of WooCommerce support.
   The recommended approach is to use your browser’s Inspect tool to target the 
   specific elements you want, or contact your theme support for guidance on a global,
   future-proof selector.
 *  Thread Starter [mstudioIL](https://wordpress.org/support/users/mstudioil/)
 * (@mstudioil)
 * [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18806019)
 * You should use the same class for every border-top and border-bottom and etc.
   
   Now there is too many classes.
 * But I going the leave the colors as they are for now
 *  [Sai (woo-hc)](https://wordpress.org/support/users/saivutukuru/)
 * (@saivutukuru)
 * [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18806047)
 * Hi [@mstudioil](https://wordpress.org/support/users/mstudioil/),
 * Understood. At this point, since changing or consolidating border classes requires
   custom CSS and theme-level decisions, this goes beyond what WooCommerce support
   can assist with directly.
 * If you decide to revisit this later, your theme support team or a front-end developer
   would be the best place to get a clean, global solution for borders on cart and
   checkout blocks.
 * Thanks for the update, and feel free to open a new thread if you run into any
   other WooCommerce issues.
   If you found our support helpful, please leave us a
   review [here](https://wordpress.org/support/plugin/woocommerce/reviews/#new-post).

Viewing 10 replies - 1 through 10 (of 10 total)

You must be [logged in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fhow-to-set-borders-color%2F%3Foutput_format%3Dmd&locale=en_US)
to reply to this topic.

 * ![](https://ps.w.org/woocommerce/assets/icon.svg?rev=3234504)
 * [WooCommerce](https://wordpress.org/plugins/woocommerce/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/woocommerce/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/woocommerce/)
 * [Active Topics](https://wordpress.org/support/plugin/woocommerce/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/woocommerce/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/woocommerce/reviews/)

 * 10 replies
 * 5 participants
 * Last reply from: [Sai (woo-hc)](https://wordpress.org/support/users/saivutukuru/)
 * Last activity: [2 months ago](https://wordpress.org/support/topic/how-to-set-borders-color/#post-18806047)
 * Status: resolved