# Mobile first When it comes to design, we should be making sustainable choices from the outset. Consider the use of images and large graphics that could contribute to page weight. If possible, remove the use of stock images that provide little to no value. Choose more efficient colors and provide a [dark mode](https://www.purdue.edu/newsroom/releases/2021/Q3/dark-mode-may-not-save-your-phones-battery-life-as-much-as-you-think,-but-there-are-a-few-silver-linings.html) by default, which could reduce energy usage even further. Switching from light mode to dark mode at 100% brightness can save an average of 39%-47% battery power. Dark mode support has [existed on the web since 2019](https://caniuse.com/prefers-color-scheme) and should be taken into account. Start with mobile-first and scale up if necessary, introducing design tweaks at bigger viewports. The [Lowww Directory](https://www.lowww.directory/) provides some real-world examples of sustainable design in practice without compromising on the design quality. Implement energy-saving toggles to activate a low-carbon website design during peak grid intensity. By highlighting these options to the user, we can inform them and help them to make more sustainable choices. [Boohoo](https://boohoo.co.uk) and [Herning.dk](https://herning.dk) have both introduced this recently. There are tools such as the [Carbon Intensity API](https://www.carbonintensity.org.uk) and the [Carbon Aware Software Development Kit (SDK)](https://github.com/Green-Software-Foundation/carbon-aware-sdk). These tools allow you to pull information about the intensity of the grid in your location. --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.umbraco.com/sustainability-best-practices/frontend/mobile-first.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.