SLDS Scenario-Based Questions

You are designing a new Lightning Web Component (LWC) for a customer dashboard. The requirement is to maintain a consistent Salesforce look and feel without writing custom CSS. How should you achieve this?

A stakeholder reports that a button in your LWC does not match the standard Salesforce UI. It looks different from other buttons in Lightning Experience. What should you do?

Your team is building a mobile-responsive Salesforce application. How can you ensure that all UI components adjust properly across different screen sizes?

Your company wants to standardize branding colors across all Salesforce applications without modifying each component individually. What is the best approach?

A form layout looks cluttered because input fields are misaligned, making it hard to read. How can you improve form readability while maintaining SLDS compliance?

Your manager asks you to create a data table where users can select multiple rows. How should you implement this using SLDS?

A customer wants required fields in an LWC form to be clearly marked. How should you indicate required fields according to SLDS best practices?

A data table in your LWC is truncating long text entries, making it hard for users to read. How can you allow text wrapping while keeping SLDS compliance?

A stakeholder wants to add a searchable dropdown to an LWC form. Which SLDS component should you use?

You need to display an error message when a user enters incorrect data into a form field. What is the SLDS-compliant way to handle this?

Your company wants to update the default font used across all Salesforce Lightning pages. What is the best way to apply this change?

A visually impaired user reports difficulty distinguishing text from the background in your LWC application. How can you improve accessibility?

You are designing a Salesforce page for right-to-left (RTL) languages like Arabic and Hebrew. How can you ensure proper text alignment?

Your company wants to apply a custom brand color to all primary buttons in Lightning Experience. What is the best approach?

A user reports that a form field's label is not being read by a screen reader. How can you fix this issue?

Your LWC page loads slowly because it contains a very large data table with hundreds of rows. What is the best way to improve performance?

A developer wants to add custom icons to a Lightning page without increasing load time. What is the best approach?

You need to implement a progress indicator for a multi-step user journey in Salesforce. Which SLDS component should you use?

A customer wants modal dialogs in their Lightning Experience to be fully accessible and support keyboard navigation. What should you do?

A team member suggests overriding SLDS styles with global CSS rules to fine-tune the UI appearance. What should you tell them?

A customer reports that users are having difficulty distinguishing buttons from background colors in your LWC app. How can you improve button visibility while keeping SLDS compliance?

You need to add an alert notification in your Lightning app to inform users about a successful operation. Which SLDS component should you use?

A client requests a collapsible sidebar navigation menu in their Lightning page. Which SLDS component should you implement?

A stakeholder wants to ensure that all tables in an LWC application maintain column alignment when resized. Which SLDS class should you use?

You need to display a numerical progress indicator for a long process in your LWC app. Which SLDS component should you use?

Your team is implementing a step-by-step user guide inside Salesforce. Which SLDS component would best fit this requirement?

A product owner requests that all modals used in a Lightning app follow accessibility standards, including screen reader support. What should you do?

Your LWC component has a list of links that appear incorrectly spaced on smaller screens. Which SLDS utility class should you apply to maintain proper spacing?

A customer asks for a way to display time-sensitive notifications inside Salesforce without requiring user interaction. Which SLDS component is the best choice?

Your company requires a data entry form where fields dynamically resize based on the available screen space. Which SLDS class should be used for proper responsiveness?

A user reports that a modal window does not close when they press the Escape key. How should you fix this while maintaining SLDS best practices?

Your design team wants to implement a flexible card-based UI that automatically adjusts to different screen sizes. Which SLDS class should you use?

A stakeholder wants to allow users to filter data in a Lightning table dynamically. Which SLDS component would best support this feature?

Your company wants to introduce a tabbed interface within a Lightning page to organize content effectively. What is the recommended SLDS component?

A developer wants to add a floating help button to an LWC component, ensuring it remains positioned at the bottom right corner. Which SLDS class should they use?

Your design team wants a way to visually separate form sections without using borders. What SLDS class should you apply?

A user reports that a button appears disabled but is still clickable. What SLDS class should you apply to ensure proper behavior?

Your company wants to highlight urgent notifications in red. Which SLDS utility class should you use?

Your team is implementing a loading animation for a data-heavy process. Which SLDS component should you use?

A stakeholder requests that a form should include inline help text next to specific fields. Which SLDS element should you use?