Squircles
Squircles are a distinctive and ownable part of our brand’s look and feel. This section details the different types and how best to utilise them in your designs to keep everything consistent and recognisably Experian.
Need a squircle asset?
Visit our Brand Asset Hub to access a range of squircle assets.
Brand Asset Hub
Introducing squircles
Squircles are those “not quite a square, not quite a circle” tiles that radiate from our brand mark.
This versatile shape can be used in a variety of ways, from framing content to creating distinctive brand visuals.
In this section, you can find details on the two types of squircles and how best to implement them.
2D squircles
We use the 2D graphic device to organise content. It can be used as a shape to contain information, frame photography, or simply to add interest in layouts.
3D squircles
We use 3D squircle renders as a distinctive brand expression asset, symbolising the flow of data. These are used in place of photography when representing the Experian brand more broadly.
Squircle construction
To ensure squircle consistency, we adopt a 1:4 corner radius ratio. Simply divide the side length by 4 to determine the corner radius.
For instance, a 100 x 100 px squircle would have a corner radius of 25 px.
Squircles as a graphic device
These examples highlight the versatility of squircles in 2D applications.
Squircles function as adaptable containers for text or imagery. They can be rotated and resized to suit the composition, and may extend beyond layout boundaries; introducing a sense of movement and energy to the design.
They can also be used as frames to house content such as headings or iconography, or simply to elevate the visual interest of a layout through their distinctive form.
Introducing 3D squircles
Our 3D squircle assets are distinctively crafted to embody the fluidity, energy, and optimism of our brand. They bring to life our brand idea, Powering Opportunities, through the visual representation of data in motion.
These assets can be used in place of traditional photography or textured backgrounds, acting as the visual focal point in layouts, marketing materials, presentations, video content, exhibition graphics, and more.
They’re a bold and recognisable way to showcase the Experian brand, and help bring our identity to life.
Working alongside photography
3D squircles do not replace photography. Photography should still be used to help with storytelling, campaigns and when highlighting products benefits.
They can be used alongside imagery, but must not be layered on top of each other. Layering imagery and 3D renders creates visual inconsistencies in texture, lighting, and perspective, which conflict with natural photography style.
Photography should support the 3D squircles and be used in a complementary role within layouts.
- Text can be added over renders if it remains legible.
- Rotate renders to fit the design as required.
- Renders should act as the hero element of the design, scale and crop as needed.
- Add a text panel over renders to aid legibility, or break up the design layout.
- Version without backgrounds allow you to apply a solid colour from the Primary or Support palette, or use a gradient.
- Holding shapes can be added to frame content if desired.
- Do not frame within shapes.
- Do not place photography on renders, and do not place renders on photography.
- Do not recolour or place overlays on renders.
- Do not use tertiary palette colour backgrounds.
- Do not distort or make renders too small.
- Do not use multiple renders in a single layout.
Corner radius guidance
Rounded edges are a core element of the Experian design language, originating from our logo, seen in both the squircles and the wordmark, and echoed throughout our iconography.
Where possible, follow this rule to ensure a cohesive and consistent visual identity across all brand materials.
When using a single rounded rectangle on a layout:
- Set the corner radius to 10% of the shortest side.
- To calculate this, simply divide the shortest edge by 10.
Multiple shapes with shared dimensions
When multiple shapes share the same height or width:
- Apply the 10% rule to the shared dimension.
- For example, if all shapes share the same width, divide that width by 10 to determine the corner radius.
In this example, both shapes have the same shortest side of 230px.
230 ÷ 10 = 23, so the corner radius is 23px.
This approach keeps all shapes looking consistent and unified.
Multiple shapes with varying sizes
When working with a variety of shapes in a single composition:
- Identify the largest and smallest shapes.
- Measure the shortest side of each shape.
- Add the two shortest sides together, then divide by 2 to find the average.
- Apply the 10% Rule by dividing this average by 10 to get the corner radius.
- Use this radius consistently across all shapes in the composition for a unified look.
In this example:
- Shape A is the largest, with a shortest side of 170px.
- Shape B is the smallest, with a shortest side of 80px.
To find a consistent corner radius:
- Add the shortest sides: 170 + 80 = 250
- Divide by 2 to get the average: 250 ÷ 2 = 125
- Apply the 10% Rule: 10% of 125 = 12.5
- Round up to the nearest whole number: 13px
