Surfaces10

Materials and interface treatments: what a surface appears to be made of.

MaterialsInterface treatments

Elements

10 · 7 described · 0 with a specimen

specimen pending Aurora / Gradient Mesh Adopting this means treating the background as diffuse coloured light rather than as a surface. Several low-saturation hues are placed as large soft blooms, usually anchored off the edge of the canvas so no source is visible, and blurred until the transitions between them have no discernible edge. Content sits over it at full opacity and must not depend on it for contrast. It is a look, not a rendering technique: a mesh interpolation produces it, and so do overlaid blurred radial gradients, and the visual result is what the module asserts. Two to four hues is typical; more reads as muddy. In Modern SaaS Also in Color specimen pending ChromeMaterial Mirror reflections, blob geometry, environment maps, near-monochrome In Y2K specimen pending Soft elevationInterface treatment Adopting this means components are separated from the background by the least depth that still reads: one shadow, widely blurred, at low opacity, offset a little downward, on a container with a generous corner radius. There is one elevation step, not a scale — everything is either on the ground or one level above it. The surface is near-white on a near-white ground, so the separation is carried by the shadow rather than by a border or a contrasting fill. It is the default, unmarked way to lift a card, which is precisely why it identifies so little. In Modern SaaS specimen pending ChalkboardMaterial Chalk dust texture, hand lettering, ribbon banners, dark slate ground specimen pending GlassmorphismInterface treatment Backdrop blur, translucent cards, thin light borders, vivid colourful backdrop specimen pending IridescentMaterial Prismatic gradients, foil textures, colour shift on motion, dark or white ground specimen pending SkeuomorphismInterface treatment Material textures, realistic shadows, bevelled edges, literal object metaphors specimen pending ClaymorphismInterface treatment Not yet described. specimen pending Liquid / Fluid InterfaceInterface treatment Not yet described. specimen pending NeumorphismInterface treatment Not yet described.

Wanted

Still being filled in

  • rounded soft systemsNeeded by Soft Minimalism

    A ui_treatment module for large-radius, low-contrast, diffuse-shadow component surfaces.

Feedback