<a href="/wiki/display/CPDesign/Illustrations">Illustrations</a>
- Created by Bernath, Anna, last modified by Milanov, Kalin on Jan 11, 2024
Table of Contents
Overview
The Horizon illustrations have the same name as the previous Quartz ones. (The dot size is added as a new size to Horizon.) The simple style version (to be used for High Contrast themes) has the same name as the default style but with the suffix "-alternate" at the end.
Naming
<p><div> <div>Illustration</div> <div>Design Naming (Figma)</div> <div>Technical Name - Horizon</div> <div>Technical Name - Horizon High Contrast</div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1838052dff32c025706589c44d131ee1e5cd5c263.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1838052dff32c025706589c44d131ee1e5cd5c263.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1838052dff32c025706589c44d131ee1e5cd5c263.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1838052dff32c025706589c44d131ee1e5cd5c263.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1838052dff32c025706589c44d131ee1e5cd5c263.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Touch ID</div> <div> <p>tnt-Scene-Fingerprint</p> <p>tnt-Dialog-Fingerprint</p> <p>tnt-Spot-Fingerprint</p> <p>tnt-Dot-Fingerprint</p> </div> <div> <p>tnt-Scene-Fingerprint-alternate</p> <p>tnt-Dialog-Fingerprint-alternate</p> <p>tnt-Spot-Fingerprint-alternate</p> <p>tnt-Dot-Fingerprint-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1889a9eee208cacefa98f09fd85a8dd57111c4e6a.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1889a9eee208cacefa98f09fd85a8dd57111c4e6a.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1889a9eee208cacefa98f09fd85a8dd57111c4e6a.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1889a9eee208cacefa98f09fd85a8dd57111c4e6a.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1889a9eee208cacefa98f09fd85a8dd57111c4e6a.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Rocket</div> <div> <p>tnt-Scene-Mission</p> <p>tnt-Dialog-Mission</p> <p>tnt-Spot-Mission</p> <p>tnt-Dot-Mission</p> </div> <div> <p>tnt-Scene-Mission-alternate</p> <p>tnt-Dialog-Mission-alternate</p> <p>tnt-Spot-Mission-alternate</p> <p>tnt-Dot-Mission-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_19cc112cf6be9ccc1c65ccc30aa092e331f6003ca.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_19cc112cf6be9ccc1c65ccc30aa092e331f6003ca.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_19cc112cf6be9ccc1c65ccc30aa092e331f6003ca.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_19cc112cf6be9ccc1c65ccc30aa092e331f6003ca.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_19cc112cf6be9ccc1c65ccc30aa092e331f6003ca.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Satellite</div> <div> <p>tnt-Scene-Services</p> <p>tnt-Dialog-Services</p> <p>tnt-Spot-Services</p> <p>tnt-Dot-Services</p> </div> <div> <p>tnt-Scene-Services-alternate</p> <p>tnt-Dialog-Services-alternate</p> <p>tnt-Spot-Services-alternate</p> <p>tnt-Dot-Services-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1da1cd9bdfca757c7022c70f0f934eacc07cf5c97.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1da1cd9bdfca757c7022c70f0f934eacc07cf5c97.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1da1cd9bdfca757c7022c70f0f934eacc07cf5c97.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1da1cd9bdfca757c7022c70f0f934eacc07cf5c97.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1da1cd9bdfca757c7022c70f0f934eacc07cf5c97.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Radar</div> <div> <p>tnt-Scene-Radar</p> <p>tnt-Dialog-Radar</p> <p>tnt-Spot-Radar</p> <p>tnt-Dot-Radar</p> </div> <div> <p>tnt-Scene-Radar-alternate</p> <p>tnt-Dialog-Radar-alternate</p> <p>tnt-Spot-Radar-alternate</p> <p>tnt-Dot-Radar-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1bff0a65a93742f04ccf92977e07cc881fee13ba3.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1bff0a65a93742f04ccf92977e07cc881fee13ba3.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1bff0a65a93742f04ccf92977e07cc881fee13ba3.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1bff0a65a93742f04ccf92977e07cc881fee13ba3.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1bff0a65a93742f04ccf92977e07cc881fee13ba3.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Team</div> <div> <p>tnt-Scene-Teams</p> <p>tnt-Dialog-Teams</p> <p>tnt-Spot-Teams</p> <p>tnt-Dot-Teams</p> </div> <div> <p>tnt-Scene-Teams-alternate</p> <p>tnt-Dialog-Teams-alternate</p> <p>tnt-Spot-Teams-alternate</p> <p>tnt-Dot-Teams-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1cf174eff8620c8ee6aac0389791fc720f5034489.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1cf174eff8620c8ee6aac0389791fc720f5034489.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1cf174eff8620c8ee6aac0389791fc720f5034489.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1cf174eff8620c8ee6aac0389791fc720f5034489.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1cf174eff8620c8ee6aac0389791fc720f5034489.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Planet</div> <div> <p>tnt-Scene-Success</p> <p>tnt-Dialog-Success</p> <p>tnt-Spot-Success</p> <p>tnt-Dot-Success</p> </div> <div> <p>tnt-Scene-Success-alternate</p> <p>tnt-Dialog-Success-alternate</p> <p>tnt-Spot-Success-alternate</p> <p>tnt-Dot-Success-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1ef08d6442a03e234a5d1ae00984fe01bf4654dd9.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1ef08d6442a03e234a5d1ae00984fe01bf4654dd9.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1ef08d6442a03e234a5d1ae00984fe01bf4654dd9.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1ef08d6442a03e234a5d1ae00984fe01bf4654dd9.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1ef08d6442a03e234a5d1ae00984fe01bf4654dd9.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Session Expiring</div> <div> <p>tnt-Scene-SessionExpiring</p> <p>tnt-Dialog-SessionExpiring</p> <p>tnt-Spot-SessionExpiring</p> <p>tnt-Dot-SessionExpiring</p> </div> <div> <p>tnt-Scene-SessionExpiring-alternate</p> <p>tnt-Dialog-SessionExpiring-alternate</p> <p>tnt-Spot-SessionExpiring-alternate</p> <p>tnt-Dot-SessionExpiring-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_14fa95ead15d2f703ffe364104afe9abee5bebfdb.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_14fa95ead15d2f703ffe364104afe9abee5bebfdb.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_14fa95ead15d2f703ffe364104afe9abee5bebfdb.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_14fa95ead15d2f703ffe364104afe9abee5bebfdb.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_14fa95ead15d2f703ffe364104afe9abee5bebfdb.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Session Expired</div> <div> <p>tnt-Scene-SessionExpired</p> <p>tnt-Dialog-SessionExpired</p> <p>tnt-Spot-SessionExpired</p> <p>tnt-Dot-SessionExpired</p> </div> <div> <p>tnt-Scene-SessionExpired-alternate</p> <p>tnt-Dialog-SessionExpired-alternate</p> <p>tnt-Spot-SessionExpired-alternate</p> <p>tnt-Dot-SessionExpired-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1aa046f24d1871d8cfeeb888173490f63fc042cc8.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1aa046f24d1871d8cfeeb888173490f63fc042cc8.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1aa046f24d1871d8cfeeb888173490f63fc042cc8.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1aa046f24d1871d8cfeeb888173490f63fc042cc8.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1aa046f24d1871d8cfeeb888173490f63fc042cc8.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Components</div> <div> <p>tnt-Scene-Components</p> <p>tnt-Dialog-Components</p> <p>tnt-Spot-Components</p> <p>tnt-Dot-Components</p> </div> <div> <p>tnt-Scene-Components-alternate</p> <p>tnt-Dialog-Components-alternate</p> <p>tnt-Spot-Components-alternate</p> <p>tnt-Dot-Components-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_14a543c28fc10caf50fb7889260a2ae0e2cd6313b.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_14a543c28fc10caf50fb7889260a2ae0e2cd6313b.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_14a543c28fc10caf50fb7889260a2ae0e2cd6313b.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_14a543c28fc10caf50fb7889260a2ae0e2cd6313b.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_14a543c28fc10caf50fb7889260a2ae0e2cd6313b.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Face ID</div> <div> <p>tnt-Scene-FaceID</p> <p>tnt-Dialog-FaceID</p> <p>tnt-Spot-FaceID</p> <p>tnt-Dot-FaceID</p> </div> <div> <p>tnt-Scene-FaceID-alternate</p> <p>tnt-Dialog-FaceID-alternate</p> <p>tnt-Spot-FaceID-alternate</p> <p>tnt-Dot-FaceID-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1eb52b5cb8176fc990a7455d1263ecc14ffa2f3d6.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1eb52b5cb8176fc990a7455d1263ecc14ffa2f3d6.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1eb52b5cb8176fc990a7455d1263ecc14ffa2f3d6.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1eb52b5cb8176fc990a7455d1263ecc14ffa2f3d6.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1eb52b5cb8176fc990a7455d1263ecc14ffa2f3d6.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Company</div> <div> <p>tnt-Scene-Company</p> <p>tnt-Dialog-Company</p> <p>tnt-Spot-Company</p> <p>tnt-Dot-Company</p> </div> <div> <p>tnt-Scene-Company-alternate</p> <p>tnt-Dialog-Company-alternate</p> <p>tnt-Spot-Company-alternate</p> <p>tnt-Dot-Company-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_126a3a32a825b66fa9228e54764594bffc2790dbe.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_126a3a32a825b66fa9228e54764594bffc2790dbe.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_126a3a32a825b66fa9228e54764594bffc2790dbe.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_126a3a32a825b66fa9228e54764594bffc2790dbe.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_126a3a32a825b66fa9228e54764594bffc2790dbe.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Tools</div> <div> <p>tnt-Scene-Tools</p> <p>tnt-Dialog-Tools</p> <p>tnt-Spot-Tools</p> <p>tnt-Dot-Tools</p> </div> <div> <p>tnt-Scene-Tools-alternate</p> <p>tnt-Dialog-Tools-alternate</p> <p>tnt-Spot-Tools-alternate</p> <p>tnt-Dot-Tools-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_15b1bbcf715f2ab6d1e8f6231464da8a84650dfcd.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_15b1bbcf715f2ab6d1e8f6231464da8a84650dfcd.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_15b1bbcf715f2ab6d1e8f6231464da8a84650dfcd.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_15b1bbcf715f2ab6d1e8f6231464da8a84650dfcd.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_15b1bbcf715f2ab6d1e8f6231464da8a84650dfcd.png?width=750&format=png&optimize=medium</a>" width="300" height="207"> </picture> </div> <div>No Users</div> <div> <p>tnt-Scene-NoUsers</p> <p>tnt-Dialog-NoUsers</p> <p>tnt-Spot-NoUsers</p> <p>tnt-Dot-NoUsers</p> </div> <div> <p>tnt-Scene-NoUsers-alternate</p> <p>tnt-Dialog-NoUsers-alternate</p> <p>tnt-Spot-NoUsers-alternate</p> <p>tnt-Dot-NoUsers-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1e10ea04059236ef47939b08c6f7332e04750fe24.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1e10ea04059236ef47939b08c6f7332e04750fe24.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1e10ea04059236ef47939b08c6f7332e04750fe24.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1e10ea04059236ef47939b08c6f7332e04750fe24.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1e10ea04059236ef47939b08c6f7332e04750fe24.png?width=750&format=png&optimize=medium</a>" width="300" height="223"> </picture> </div> <div>Passwords</div> <div> <p>tnt-Scene-Secrets</p> <p>tnt-Dialog-Secrets</p> <p>tnt-Spot-Secrets</p> <p>tnt-Dot-Secrets</p> </div> <div> <p>tnt-Scene-Secrets-alternate</p> <p>tnt-Dialog-Secrets-alternate</p> <p>tnt-Spot-Secrets-alternate</p> <p>tnt-Dot-Secrets-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1dac47af344fff1c10c7e4125f84b75bceda5f99f.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1dac47af344fff1c10c7e4125f84b75bceda5f99f.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1dac47af344fff1c10c7e4125f84b75bceda5f99f.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1dac47af344fff1c10c7e4125f84b75bceda5f99f.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1dac47af344fff1c10c7e4125f84b75bceda5f99f.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Lock</div> <div> <p>tnt-Scene-Lock</p> <p>tnt-Dialog-Lock</p> <p>tnt-Spot-Lock</p> <p>tnt-Dot-Lock</p> </div> <div> <p>tnt-Scene-Lock-alternate</p> <p>tnt-Dialog-Lock-alternate</p> <p>tnt-Spot-Lock-alternate</p> <p>tnt-Dot-Lock-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1497a1b5c8125ce8a54b9842137ddff9d87b427ad.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1497a1b5c8125ce8a54b9842137ddff9d87b427ad.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1497a1b5c8125ce8a54b9842137ddff9d87b427ad.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1497a1b5c8125ce8a54b9842137ddff9d87b427ad.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1497a1b5c8125ce8a54b9842137ddff9d87b427ad.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Unlock</div> <div> <p>tnt-Scene-Unlock</p> <p>tnt-Dialog-Unlock</p> <p>tnt-Spot-Unlock</p> <p>tnt-Dot-Unlock</p> </div> <div> <p>tnt-Scene-Unlock-alternate</p> <p>tnt-Dialog-Unlock-alternate</p> <p>tnt-Spot-Unlock-alternate</p> <p>tnt-Dot-Unlock-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_100445dda5eaf84bc28724fece10440aa28b3e24b.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_100445dda5eaf84bc28724fece10440aa28b3e24b.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_100445dda5eaf84bc28724fece10440aa28b3e24b.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_100445dda5eaf84bc28724fece10440aa28b3e24b.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_100445dda5eaf84bc28724fece10440aa28b3e24b.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Systems</div> <div> <p>tnt-Scene-Systems</p> <p>tnt-Dialog-Systems</p> <p>tnt-Spot-Systems</p> <p>tnt-Dot-Systems</p> </div> <div> <p>tnt-Scene-Systems-alternate</p> <p>tnt-Dialog-Systems-alternate</p> <p>tnt-Spot-Systems-alternate</p> <p>tnt-Dot-Systems-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_10f7bc84d74b31a6b9b8f51698e8d7552bae99074.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_10f7bc84d74b31a6b9b8f51698e8d7552bae99074.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_10f7bc84d74b31a6b9b8f51698e8d7552bae99074.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_10f7bc84d74b31a6b9b8f51698e8d7552bae99074.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_10f7bc84d74b31a6b9b8f51698e8d7552bae99074.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>External Link</div> <div> <p>tnt-Scene-ExternalLink</p> <p>tnt-Dialog-ExternalLink</p> <p>tnt-Spot-ExternalLink</p> <p>tnt-Dot-ExternalLink</p> </div> <div> <p>tnt-Scene-ExternalLink-alternate</p> <p>tnt-Dialog-ExternalLink-alternate</p> <p>tnt-Spot-ExternalLink-alternate</p> <p>tnt-Dot-ExternalLink-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_11dbc4f4c877cec5a4573234b8d8d731ebddf2f1e.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_11dbc4f4c877cec5a4573234b8d8d731ebddf2f1e.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_11dbc4f4c877cec5a4573234b8d8d731ebddf2f1e.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_11dbc4f4c877cec5a4573234b8d8d731ebddf2f1e.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_11dbc4f4c877cec5a4573234b8d8d731ebddf2f1e.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>No Applications</div> <div> <p>tnt-Scene-NoApplications</p> <p>tnt-Dialog-NoApplications</p> <p>tnt-Spot-NoApplications</p> <p>tnt-Dot-NoApplications</p> </div> <div> <p>tnt-Scene-NoApplications-alternate</p> <p>tnt-Dialog-NoApplications-alternate</p> <p>tnt-Spot-NoApplications-alternate</p> <p>tnt-Dot-NoApplications-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1b7944c14918c7caf693e6c04c721dc6dd8c7da7f.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1b7944c14918c7caf693e6c04c721dc6dd8c7da7f.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1b7944c14918c7caf693e6c04c721dc6dd8c7da7f.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1b7944c14918c7caf693e6c04c721dc6dd8c7da7f.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1b7944c14918c7caf693e6c04c721dc6dd8c7da7f.png?width=750&format=png&optimize=medium</a>" width="300" height="223"> </picture> </div> <div>No Flows</div> <div> <p>tnt-Scene-NoFlows</p> <p>tnt-Dialog-NoFlows</p> <p>tnt-Spot-NoFlows</p> <p>tnt-Dot-NoFlows</p> </div> <div> <p>tnt-Scene-NoFlows-alternate</p> <p>tnt-Dialog-NoFlows-alternate</p> <p>tnt-Spot-NoFlows-alternate</p> <p>tnt-Dot-NoFlows-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_11ddc7bdf5d99657f9c55f6cd8ded25dcaa33f294.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_11ddc7bdf5d99657f9c55f6cd8ded25dcaa33f294.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_11ddc7bdf5d99657f9c55f6cd8ded25dcaa33f294.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_11ddc7bdf5d99657f9c55f6cd8ded25dcaa33f294.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_11ddc7bdf5d99657f9c55f6cd8ded25dcaa33f294.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>QR Code Placeholder</div> <div> <p>tnt-Scene-CodePlaceholder</p> <p>tnt-Dialog-CodePlaceholder</p> <p>tnt-Spot-CodePlaceholder</p> <p>tnt-Dot-CodePlaceholder</p> </div> <div> <p>tnt-Scene-CodePlaceholder-alternate</p> <p>tnt-Dialog-CodePlaceholder-alternate</p> <p>tnt-Spot-CodePlaceholder-alternate</p> <p>tnt-Dot-CodePlaceholder-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1780746dab245df5ff5940238f679614af76e8333.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1780746dab245df5ff5940238f679614af76e8333.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1780746dab245df5ff5940238f679614af76e8333.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1780746dab245df5ff5940238f679614af76e8333.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1780746dab245df5ff5940238f679614af76e8333.png?width=750&format=png&optimize=medium</a>" width="300" height="229"> </picture> </div> <div>Successful Sign In</div> <div> <p>tnt-Scene-SuccessfulAuth</p> <p>tnt-Dialog-SuccessfulAuth</p> <p>tnt-Spot-SuccessfulAuth</p> <p>tnt-Dot-SuccessfulAuth</p> </div> <div> <p>tnt-Scene-SuccessfulAuth-alternate</p> <p>tnt-Dialog-SuccessfulAuth-alternate</p> <p>tnt-Spot-SuccessfulAuth-alternate</p> <p>tnt-Dot-SuccessfulAuth-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1118cba8012193262b3ba093429ec897b288bf1a9.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1118cba8012193262b3ba093429ec897b288bf1a9.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1118cba8012193262b3ba093429ec897b288bf1a9.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1118cba8012193262b3ba093429ec897b288bf1a9.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1118cba8012193262b3ba093429ec897b288bf1a9.png?width=750&format=png&optimize=medium</a>" width="300" height="229"> </picture> </div> <div>Unsuccessful Sign In</div> <div> <p>tnt-Scene-UnSuccessfulAuth</p> <p>tnt-Dialog-UnSuccessfulAuth</p> <p>tnt-Spot-UnSuccessfulAuth</p> <p>tnt-Dot-UnSuccessfulAuth</p> </div> <div> <p>tnt-Scene-UnSuccessfulAuth-alternate</p> <p>tnt-Dialog-UnSuccessfulAuth-alternate</p> <p>tnt-Spot-UnSuccessfulAuth-alternate</p> <p>tnt-Dot-UnSuccessfulAuth-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1db5a86d4473fe42e59fc1f7c58721fb987933062.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1db5a86d4473fe42e59fc1f7c58721fb987933062.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1db5a86d4473fe42e59fc1f7c58721fb987933062.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1db5a86d4473fe42e59fc1f7c58721fb987933062.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1db5a86d4473fe42e59fc1f7c58721fb987933062.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Flow Chart</div> <div> <p>tnt-Scene-ChartFlow</p> <p>tnt-Dialog-ChartFlow</p> <p>tnt-Spot-ChartFlow</p> <p>tnt-Dot-ChartFlow</p> </div> <div> <p>tnt-Scene-ChartFlow-alternate</p> <p>tnt-Dialog-ChartFlow-alternate</p> <p>tnt-Spot-ChartFlow-alternate</p> <p>tnt-Dot-ChartFlow-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_100541ed7bb4c056a8df470772f699278a2bd2a00.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_100541ed7bb4c056a8df470772f699278a2bd2a00.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_100541ed7bb4c056a8df470772f699278a2bd2a00.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_100541ed7bb4c056a8df470772f699278a2bd2a00.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_100541ed7bb4c056a8df470772f699278a2bd2a00.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>BPMN Flow Chart</div> <div> <p>tnt-Scene-ChartBPMNFlow</p> <p>tnt-Dialog-ChartBPMNFlow</p> <p>tnt-Spot-ChartBPMNFlow</p> <p>tnt-Dot-ChartBPMNFlow</p> </div> <div> <p>tnt-Scene-ChartBPMNFlow-alternate</p> <p>tnt-Dialog-ChartBPMNFlow-alternate</p> <p>tnt-Spot-ChartBPMNFlow-alternate</p> <p>tnt-Dot-ChartBPMNFlow-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_12996b09433e0006425295322fec84d329397da8c.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_12996b09433e0006425295322fec84d329397da8c.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_12996b09433e0006425295322fec84d329397da8c.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_12996b09433e0006425295322fec84d329397da8c.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_12996b09433e0006425295322fec84d329397da8c.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Pie Chart</div> <div> <p>tnt-Scene-ChartPie</p> <p>tnt-Dialog-ChartPie</p> <p>tnt-Spot-ChartPie</p> <p>tnt-Dot-ChartPie</p> </div> <div> <p>tnt-Scene-ChartPie-alternate</p> <p>tnt-Dialog-ChartPie-alternate</p> <p>tnt-Spot-ChartPie-alternate</p> <p>tnt-Dot-ChartPie-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1c708f9091b7ce4a526f304e6b2d5542e4fb0258c.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1c708f9091b7ce4a526f304e6b2d5542e4fb0258c.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1c708f9091b7ce4a526f304e6b2d5542e4fb0258c.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1c708f9091b7ce4a526f304e6b2d5542e4fb0258c.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1c708f9091b7ce4a526f304e6b2d5542e4fb0258c.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Doughnut Chart</div> <div> <p>tnt-Scene-ChartDoughnut</p> <p>tnt-Dialog-ChartDoughnut</p> <p>tnt-Spot-ChartDoughnut</p> <p>tnt-Dot-ChartDoughnut</p> </div> <div> <p>tnt-Scene-ChartDoughnut-alternate</p> <p>tnt-Dialog-ChartDoughnut-alternate</p> <p>tnt-Spot-ChartDoughnut-alternate</p> <p>tnt-Dot-ChartDoughnut-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1172c8fbe0f024ef142535015834e114fa4876d44.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1172c8fbe0f024ef142535015834e114fa4876d44.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1172c8fbe0f024ef142535015834e114fa4876d44.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1172c8fbe0f024ef142535015834e114fa4876d44.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1172c8fbe0f024ef142535015834e114fa4876d44.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Org Chart</div> <div> <p>tnt-Scene-ChartOrg</p> <p>tnt-Dialog-ChartOrg</p> <p>tnt-Spot-ChartOrg</p> <p>tnt-Dot-ChartOrg</p> </div> <div> <p>tnt-Scene-ChartOrg-alternate</p> <p>tnt-Dialog-ChartOrg-alternate</p> <p>tnt-Spot-ChartOrg-alternate</p> <p>tnt-Dot-ChartOrg-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1235b164ca56f5d62ac6c60ab12aca65d5f729768.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1235b164ca56f5d62ac6c60ab12aca65d5f729768.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1235b164ca56f5d62ac6c60ab12aca65d5f729768.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1235b164ca56f5d62ac6c60ab12aca65d5f729768.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1235b164ca56f5d62ac6c60ab12aca65d5f729768.png?width=750&format=png&optimize=medium</a>" width="300" height="224"> </picture> </div> <div>Gantt Chart</div> <div> <p>tnt-Scene-ChartGantt</p> <p>tnt-Dialog-ChartGantt</p> <p>tnt-Spot-ChartGantt</p> <p>tnt-Dot-ChartGantt</p> </div> <div> <p>tnt-Scene-ChartGantt-alternate</p> <p>tnt-Dialog-ChartGantt-alternate</p> <p>tnt-Spot-ChartGantt-alternate</p> <p>tnt-Dot-ChartGantt-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_16064bc60c1e747c3486f80e31ad3937e1571092b.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_16064bc60c1e747c3486f80e31ad3937e1571092b.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_16064bc60c1e747c3486f80e31ad3937e1571092b.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_16064bc60c1e747c3486f80e31ad3937e1571092b.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_16064bc60c1e747c3486f80e31ad3937e1571092b.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Bullet Chart</div> <div> <p>tnt-Scene-ChartBullet</p> <p>tnt-Dialog-ChartBullet</p> <p>tnt-Spot-ChartBullet</p> <p>tnt-Dot-ChartBullet</p> </div> <div> <p>tnt-Scene-ChartBullet-alternate</p> <p>tnt-Dialog-ChartBullet-alternate</p> <p>tnt-Spot-ChartBullet-alternate</p> <p>tnt-Dot-ChartBullet-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_11706fc445fc5169526ee1c8a330d5fbc30cdc8fe.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_11706fc445fc5169526ee1c8a330d5fbc30cdc8fe.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_11706fc445fc5169526ee1c8a330d5fbc30cdc8fe.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_11706fc445fc5169526ee1c8a330d5fbc30cdc8fe.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_11706fc445fc5169526ee1c8a330d5fbc30cdc8fe.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Bar Chart</div> <div> <p>tnt-Scene-ChartBar</p> <p>tnt-Dialog-ChartBar</p> <p>tnt-Spot-ChartBar</p> <p>tnt-Dot-ChartBar</p> </div> <div> <p>tnt-Scene-ChartBar-alternate</p> <p>tnt-Dialog-ChartBar-alternate</p> <p>tnt-Spot-ChartBar-alternate</p> <p>tnt-Dot-ChartBar-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_14e4446b89f921b31bdf5f6923da05b68a466009c.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_14e4446b89f921b31bdf5f6923da05b68a466009c.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_14e4446b89f921b31bdf5f6923da05b68a466009c.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_14e4446b89f921b31bdf5f6923da05b68a466009c.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_14e4446b89f921b31bdf5f6923da05b68a466009c.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Line Chart</div> <div> <p>tnt-Scene-ChartArea</p> <p>tnt-Dialog-ChartArea</p> <p>tnt-Spot-ChartArea</p> <p>tnt-Dot-ChartArea</p> </div> <div> <p>tnt-Scene-ChartArea-alternate</p> <p>tnt-Dialog-ChartArea-alternate</p> <p>tnt-Spot-ChartArea-alternate</p> <p>tnt-Dot-ChartArea-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_1792e4f2bfefe309eba422c8843e2afe82ce5d2bc.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_1792e4f2bfefe309eba422c8843e2afe82ce5d2bc.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_1792e4f2bfefe309eba422c8843e2afe82ce5d2bc.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_1792e4f2bfefe309eba422c8843e2afe82ce5d2bc.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_1792e4f2bfefe309eba422c8843e2afe82ce5d2bc.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Area Chart</div> <div> <p>tnt-Scene-ChartArea2</p> <p>tnt-Dialog-ChartArea2</p> <p>tnt-Spot-ChartArea2</p> <p>tnt-Dot-ChartArea2</p> </div> <div> <p>tnt-Scene-ChartArea2-alternate</p> <p>tnt-Dialog-ChartArea2-alternate</p> <p>tnt-Spot-ChartArea2-alternate</p> <p>tnt-Dot-ChartArea2-alternate</p> </div> </div> <div> <div> <picture> <source type="image/webp" srcset="/content/dam/sapcom/design-system/btp/foundations/design-language/illustrations/media1_19f627afa9eea48a2d0074f8bc0b10bd74e03688a.png?width=2000&format=webply&optimize=medium" media="(min-width: 600px)"> <source type="image/webp" srcset="./media_19f627afa9eea48a2d0074f8bc0b10bd74e03688a.png?width=750&format=webply&optimize=medium"> <source type="image/png" srcset="./media_19f627afa9eea48a2d0074f8bc0b10bd74e03688a.png?width=2000&format=png&optimize=medium" media="(min-width: 600px)"> <img loading="lazy" alt="" src="<a href="https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media%5C_19f627afa9eea48a2d0074f8bc0b10bd74e03688a.png?width=750%5C&format=png%5C&optimize=medium">https://www.sap.com/design-system/btp/foundations/design-language/illustrations/media_19f627afa9eea48a2d0074f8bc0b10bd74e03688a.png?width=750&format=png&optimize=medium</a>" width="300" height="225"> </picture> </div> <div>Empty Content Pane</div> <div> <p>tnt-Scene-EmptyContentPane</p> <p>tnt-Dialog-EmptyContentPane</p> <p>tnt-Spot-EmptyContentPane</p> <p>tnt-Dot-EmptyContentPane</p> </div> <div> <p>tnt-Scene-EmptyContentPane-alternate</p> <p>tnt-Dialog-EmptyContentPane-alternate</p> <p>tnt-Spot-EmptyContentPane-alternate</p> <p>tnt-Dot-EmptyContentPane-alternate</p> </div> </div></p>