Follow these steps to display the profit margin on the product card:

1. Add the following code to the /static/src/js/pos_demo.js file to fetch the extra field for the product's actual price:

var pos_model = require('point_of_sale.models');
    pos_model.load_fields("product.product", "standard_price");

2. Add the following code to /static/src/xml/pos_demo.xml in order to display a profit margin product card:

 <t t-extend="Product">
 <t t-jquery=".price-tag" t-operation="after">
 <span t-if="product.standard_price" class="sale_margin">
 <t t-set="margin" 
 t-value="product.list_price - product.standard_price"/>
 <t t-esc="widget.format_currency(margin)"/>
 </span>
 </t>
</t>

3. Add the following style sheet to style the margin text:

.sale_margin {
        top: 21px;
        line-height: 15px;
        right: 2px;
        background: #CDDC39;
        position: absolute;
        border-radius: 10px;
        padding: 0px 5px;
    }

Update the pos_demo module to apply the changes. After that, you will be able to see the profit margin on the product card: