Starting with two variations of "Sliding hero & content" Banner Image, two examples are identical. Only difference is below one allows us to play autoplay videos in Mute

 
 
 
 
 
 

Lorem Ipsum

Featured Block Card Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

Hero Card Title 2

Featured Block Card Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

 
 
 

Lorem Ipsum

Learn more

Featured Block test

Aliquam sodales sodales est, id eleifend quam pellentesque ac. Praesent eu posuere ante. Nulla facilisi. Suspendisse bibendum tortor sed vehicula sagittis. Praesent fringilla mi quis ligula feugiat, eget posuere mauris finibus. In convallis mauris in turpis commodo, a viverra lacus accumsan. Aenean eu orci elit. Maecenas aliquam purus at dui posuere suscipit. Phasellus vestibulum pellentesque mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse molestie interdum tortor, a gravida dolor lobortis nec. Mauris hendrerit dignissim lacus sed ultrices. Aenean lobortis ipsum ut ante commodo suscipit. Sed efficitur mi sit amet pharetra dapibus. Donec luctus neque vel neque feugiat venenatis.

Lorem Ipsum</p>

A call to action.

Hero Image Test

Aliquam sodales sodales est, id eleifend quam pellentesque ac. Praesent eu posuere ante. Nulla facilisi. Suspendisse bibendum tortor sed vehicula sagittis. Praesent fringilla mi quis ligula feugiat, eget posuere mauris finibus. In convallis mauris in turpis commodo, a viverra lacus accumsan. Aenean eu orci elit. Maecenas aliquam purus at dui posuere suscipit. Phasellus vestibulum pellentesque mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse molestie interdum tortor, a gravida dolor lobortis nec. Mauris hendrerit dignissim lacus sed ultrices. Aenean lobortis ipsum ut ante commodo suscipit. Sed efficitur mi sit amet pharetra dapibus. Donec luctus neque vel neque feugiat venenatis.

 
 
 

I would like to showcase the example that we have in Thermo Man event, personally I like this view a lot.

Scientific and Technical Seminar Thermo-Man® 2025

Tests that burn the risks! <br><br>Location: Centrum Logistyczne, ul. Staszica 9A, Przysucha, Polska<br><br> 26-30 May 2025

We can apply SafeSPEC(tm) header as well.

 
 
 

Showcasing the Unique banner experience that we have in Tychem page.

 
 
 

A nice view from Nomex Xtreme Performance Page as well.

Nomex® Xtreme Performance

 
 
 

A card component where we can feature a asset and logo at the same time

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a malesuada leo. Praesent vitae iaculis sapien, egestas euismod leo. Proin convallis non elit at tristique. Aliquam suscipit tempus tellus, quis vulputate nulla. Donec pretium et ante eu cursus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla lacinia molestie ex, sed facilisis purus semper vel. Aenean tristique ante eu augue tincidunt, at feugiat leo auctor.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a malesuada leo. Praesent vitae iaculis sapien, egestas euismod leo. Proin convallis non elit at tristique. Aliquam suscipit tempus tellus, quis vulputate nulla. Donec pretium et ante eu cursus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla lacinia molestie ex, sed facilisis purus semper vel. Aenean tristique ante eu augue tincidunt, at feugiat leo auctor.

Headline

Carousel Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a malesuada leo. Praesent vitae iaculis sapien, egestas euismod leo. Proin convallis non elit at tristique. Aliquam suscipit tempus tellus, quis vulputate nulla. 

Carousel Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a malesuada leo. Praesent vitae iaculis sapien, egestas euismod leo. Proin convallis non elit at tristique. Aliquam suscipit tempus tellus, quis vulputate nulla. 

In case if you would like to feature FAQs at the website, we are capable of doing this by using the accordions.

  • FAQs?

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a malesuada leo. Praesent vitae iaculis sapien, egestas euismod leo. Proin convallis non elit at tristique. Aliquam suscipit tempus tellus, quis vulputate nulla. Donec pretium et ante eu cursus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla lacinia molestie ex, sed facilisis purus semper vel. Aenean tristique ante eu augue tincidunt, at feugiat leo auctor.

  • Ut suscipit enim libero, nec tempus metus finibus sed. Sed venenatis sit amet nisi sed pretium. Maecenas sodales urna id dolor facilisis, eu consequat ex dapibus. Donec sed placerat massa. Sed interdum, metus tincidunt sollicitudin mollis, sapien metus commodo metus, sed porttitor lectus elit quis nisl. Curabitur porta quis enim eu cursus. Quisque elementum neque ex, ut ultricies est auctor quis. In vitae ultricies augue, sit amet imperdiet libero. Proin euismod tincidunt libero, eget accumsan leo placerat nec. Integer at sodales odio. Praesent ullamcorper tortor sit amet pretium cursus. Etiam convallis urna at enim viverra, a rhoncus tellus tempus. Nulla aliquam pulvinar nulla eget finibus. Proin ullamcorper dapibus pretium. Aliquam massa libero, consectetur sit amet faucibus ac, facilisis eu libero. Aenean condimentum ex suscipit, commodo ante quis, rhoncus magna.

  • Mauris lacinia risus justo. Nunc dapibus lectus a congue tincidunt. Nunc ultricies, felis sit amet pharetra finibus, mauris est fermentum erat, et efficitur eros nisi non magna. Mauris convallis ante facilisis dignissim accumsan. Nam elementum laoreet purus vitae posuere. Aliquam at scelerisque sapien. Donec at velit enim. Morbi ultrices quis risus nec iaculis. Morbi at dolor ultrices, aliquet nunc eget, fringilla justo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin accumsan malesuada molestie. Aenean tincidunt porttitor fringilla. Cras congue nec nunc at mollis. Phasellus ullamcorper nibh ut commodo suscipit. Pellentesque enim mi, scelerisque vitae dignissim id, aliquam eu turpis. Duis gravida diam a vestibulum sagittis.

A great animation behaviour which enables to you to insert a short title and description & allows you to navigate some other key pages.

We have this already on some websites, just wanted to re-share it.

<span style="font-size: 32px"><strong>The challenge: making disposable cleanroom PPE recyclable</strong></span><br><br><span style="font-size: 18px">Founded in 1885, Boehringer Ingelheim is a family-owned organisation with over 53,000 employees and is present in 130 countries. The company’s two core business units are Human Pharma and Animal Health. Throughout its history, Boehringer Ingelheim has developed transformative breakthrough therapies for some of the most prevalent medical conditions, from cardiovascular disease to cancer and lung disease.<br><br>Boehringer Ingelheim's medical device for treating Chronic Obstructive Pulmonary Disease (COPD) is the propellant-free inhaler RESPIMAT®. Up to 45 million of these devices are manufactured yearly at Boehringer Ingelheim’s <a target="_blank" href="https://www.boehringer-ingelheim.com/sites-around-world/dortmund"><span style="color: rgb(228,0,28);"><b><u><span class="fontsize16">state-of-the-art facility</u></b></a></span> in Dortmund, Germany. <br><br> Part of the RESPIMAT® production process occurs in cleanroom environments (Grade D) according to the <a target="_blank" href="https://www.gmp-compliance.org/guidelines/gmp-guideline/eu-gmp-annex-1-manufacture-of-sterile-medicinal-products"><span style="color: rgb(228,0,28);"><b><u><span class="fontsize16">E.U. GMP Annex 1: Manufacture of Sterile Medicinal Products</u></b></span></a> guidelines. PPE like coveralls and gowns are essential to protect workers in these environments against exposure to hazardous chemicals. This equipment is also critical to preventing contamination that can compromise RESPIMAT®’s safety and quality.
 
 
 

We have this already on some websites, just wanted to re-share it.

We are using a different variation of this component at the end of the pages
SafeSPEC & Resource Center & WTB

Here comes a new finding, we can author images and videos to this component and they are expanding as people click on them. It would look best with 4 different assets.

 

The only thing that bothers me, I think the text block is too tiny. I didn't have the chance to check if I can manipulate the space of the text block by adding some external codes, normally it should be doable.

 

Really like the form of Call to Action button

Header

Title goes here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

 
 
 

Another new finding, we are using a lot of text-image component but this one allows to navigate between assets.

 

Same concern like above, text block is too tiny in my opinion also letter spacing for title needs to be adjusted by adding some extra codes. This should be doable, no promises but should be easy fix.

Title for this block

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

Title for this block

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

Another live example, great way to feature key documents

 
 
 
 
 
 

Another live example

 

With the correct tagging, we can feature the videos, documents that we would like to display here. This is set for Nomex Xtreme Performance page, dedicated to firefighter videos only. For example, it is possible to Showcase most recent Tyvek related videos, brochures and this connects people to RC as well - when users clicks on learn more

Testimonials

To access secured content from DuPont Please Sign In or Sign Up below

    Parallax View

     A component that we use frequently but would like to add it to here as well

    Parallax Headline

    Parallax Subheadline

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

     
     
     

    Below you are going to see a lot of simliar components, this works well when we have a great background color or asset, It would be so nice if we can use change the position of the text and image, couldn't managed to do so but we can ask TCS about this.

     

    Additionally, the example at the very end is my favourite, where you can display multiple assets.

    Parallax Headline
    Parallax Headline

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

    Parallax Headline

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

    Parallax Subheadline

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

    Parallax Subheadline

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.

    <p><span style="color: rgb(255,255,255);">Parallax Subheadline</span></p>

    <p><span style="color: rgb(255,255,255);">Parallax Subheadline</span></p>

    <p><span style="color: rgb(255,255,255);">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus mollis orci at dignissim suscipit. Pellentesque vehicula nibh lacus, id vulputate tellus ullamcorper sed. Sed eu cursus lacus. Mauris pellentesque, mauris id convallis pellentesque, turpis orci hendrerit ex, a dictum risus urna quis odio. Phasellus quis metus luctus, dictum nulla vel, ultricies enim. Fusce porttitor consectetur mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer metus est, posuere a gravida ut, accumsan in urna. Quisque viverra urna sem, eu mattis sapien rhoncus pellentesque. Quisque dolor eros, faucibus at urna ut, euismod faucibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque a dui quis metus fermentum porttitor. Suspendisse suscipit, diam non malesuada imperdiet, felis ipsum sagittis ex, ac gravida eros odio non est.</span></p>
    CTA
     
     
     
    " Some quote "

    Nathalie Florin

    Nomex®

    Nomex® provides heat and flame protection as well as wash durability, abrasion resistance, softness, comfort and multicolor design options

    Nomex® Nano and Nomex® Nano Flex

    Nomex® Nano and Nomex® Nano Flex are light and thin barriers providing thermal and particulate protection while enhancing the garment’s overall agility, moisture-management and comfort

    Kevlar®

    Kevlar®, a trusted brand name for over 50 years, is the most effective and prevalent fibers in today’s firefighter TOG with proven, foundational performance

    PBO

    PBO, an exceptional fiber with remarkable mechanical strength and flame-blocking resilience, makes a highly functional gear possible offering superb protection that is lightweight and durable

     
     
     

    A new piece

    Applications Ares

    Application Areas

    Products used:

     
     
     
    Tyvek for PPE

    Some information regarding Tyvek

    Learn more
    Tychem for PPE

    Some information regarding Tychem

    Learn more

    Tyvek 400 Garments

    Lorem ipsum dolor sit amet

    2 Cone Nozzles

    Spray up to 4 inches wide for more precise sealing in tight spaces and around corners.

    2 Fan Nozzles

    Spray up to 6 inches wide to quickly cover large gaps from a distance.