This is an example of an invoice print template, designed using CSS, HTML, JavaScript, and Bootstrap framework 4. JavaScript methods have been used to create the functionality of the print button. The company logo has been imported to the code as an image with its URL. The background color of the form is set as #FFF. The invoice header is given a border-bottom style of 1px solid #3989c6. The text-align style of the company details section is set as right. The invoice ID is displayed with a font color of #3989c6. The table column headers are displayed with a font-size of 16px, and a font-weight of 400. The Total section is given a background color as #3989c6, and font color as #fff. The Grand Total section is displayed with the styles of color as #3989c6, font-size as 1.4em, and border-top as 1px solid #3989c6. Media quarries have been used to increase the responsiveness of the form. Source: https://bootsnipp.com/snippets/8MPnQ
This is an example of an order confirmation invoice/bill template, designed using HTML, CSS, and Bootstrap framework 4. It displays the purchased products, product images, purchased quantity, and pricing details with the total amounts. The product images and the font style is imported to the code with their URLs. The body of the form is given the styles of background-color as #ffe8d2, and font-family as 'Montserrat', sans-serif. The footer and logo area of the form is given a background color of #eeeeeea8. The product quantity is displayed using the styles of font-size as 12px, and font color as #dedbdb. The prices are displayed using a font-weight style as bold to make them highlighted. The discount value is displayed using the success style making the font color green. The justify-content style is set as center in HTML, to centralize the form. Source:https://bbbootstrap.com/snippets/bootstrap-order-confirmation-invoice-bill-template-49857128
This is an example of a sale invoice template, designed using CSS, HTML, and Bootstrap framework 4. The template can be used to display the product details, pricing details, and proceed to payment or to get a printout. The form is given a style set of position as relative, display as flex, flex-direction as column, word-wrap as break-word to allow breaking and wrapping long words onto the next line, background-color as #fff, background-clip as border-box, border as 1px solid #c8ced3, and border-radius as .25rem. The card header is given the styles of padding as .75rem 1.25rem, background-color as #f0f3f5, and border-bottom as 1px solid #c8ced3. The 'Print' and 'Save' buttons are crated as secondary and info type buttons in the HTML. The headings are given a text style as strong, in the HTML to make them highlighted. The 'Proceed to Payment' button is created as a success type button in HTML. Source: https://bbbootstrap.com/snippets/sale-invoice-template-85038753