--- title: Indented styles and the Ubuntu shape description: Since we released the initial demo of Ubuntu on phones, we’ve been looking at refining the whole Suru theme — the theme on Ubuntu for phones and tablets — and creating visual guidelines for it. Two of the things that we evolved were the treatment of the indented style and the corner size of the […] url: https://canonical.com/blog/indented-styles-and-the-ubuntu-shape?format=md --- 1. [Blog](https://canonical.com/blog) 2. Article --- [Canonical](https://canonical.com/blog/author/canonical "More about Canonical") 25 October 2013 # Indented styles and the Ubuntu shape [Design](https://canonical.com/blog/tag/design) --- Share the article Since we released the initial demo of Ubuntu on phones, we’ve been looking at refining the whole Suru theme — the theme on Ubuntu for phones and tablets — and creating visual guidelines for it. Two of the things that we evolved were the treatment of the indented style and the corner size of the Ubuntu shape — the *squircle*. We wanted to make sure these were consistent across the theme so that any designer and developer could follow the same guidelines. *The Ubuntu squircle shape* ## Explorations There were lots of discussions about what kind of shadows we should use — blurred shadows, sharp shadows or a combination of the two — to represent the indented style, and we went through various iterations. *Variations on grey* Soon after we started looking into the indented style we decided to look at the corner size of the shape at the same time, as they work together. Since the squircle is not an ordinary shape, it can’t just be scaled up and down as needed, so we arrived at four different corner sizes that can be used in the different sizes necessary across the theme. *The four different corner sizes of the Ubuntu shape* One of the main goals for the shadows was to make sure they worked with different images inside the shape and on different backgrounds. We also needed to consider the pressed state of the shape, which has a bigger shadow inside. *Variations of Maps icon on different backgrounds in the normal and pressed states* When the shape is used, it’s not always indented (like in popovers and notifications), so we also had to study these variations too. ## Final styles And finally after many iterations, discussions and reviews, here are the current styles of the indented and non-indented shapes. *Telephony icon on different backgrounds* We’ve started to put these guidelines on [design.ubuntu.com](http://design.ubuntu.com/), where you can follow their evolution. [Get in touch Interested in running Ubuntu in your organization?](https://ubuntu.com/about/contact-us/form) ## Sign up for our newsletter Get the latest Canonical news and updates in your inbox. Work email: \*I agree to receive information about Canonical's products and services. By submitting this form, I confirm that I have read and agree to [Canonical's Privacy Policy](https://canonical.com/legal/dataprivacy). Sign up ## Share on --- ## Related posts [### Challenges designers face in open source (and how to fix them)](https://canonical.com/blog/challenges-designers-face-in-open-source-and-how-to-fix-them) Open source powers up to 90% of modern software, yet many projects lack usability. Canonical’s Design team surveyed 115 cross-functional professionals to uncover the 4 core... [Kola Ojoodide](https://canonical.com/blog/author/kola-ojoodide) 26 June 2026 [### Why web engineering is great](https://canonical.com/blog/why-web-engineering-is-great) Hi, I’m Johann! I’m an engineering manager in Canonical’s web team. For the larger part of my 15 years of work experience as engineer, I’ve been working in web development.... [Johann Wolf](https://canonical.com/blog/author/johannwolf) 27 April 2026 [### Canonical’s recipe for High Performance Computing](https://canonical.com/blog/canonicals-recipe-for-high-performance-computing) In essence, High Performance Computing (HPC) is quite simple. Speed and scale. In practice, the concept is quite complex and hard to achieve. It is not dissimilar to what... [Igor Ljubuncic](https://canonical.com/blog/author/igorljubuncic) 24 January 2024 [### Web team – hack week 2023](https://canonical.com/blog/web-team-hack-week-2023) Today, around 96% of software projects utilize open source in some way. The web team here at Canonical is passionate about Open source. We lead with an open-by-default approach... [Anthony Dillon](https://canonical.com/blog/author/ya-bo-ng) 25 October 2023