---
schema: 1
type: term
title: '**inner shadows**'
description: >-
  **Inner shadows** are a layer effect that draws a shadow inside the edges of a
  shape, making the element look inset or recessed — the opposite of a drop
  shadow, which falls outside the shape.
canonical: 'https://liquidgold.cc/channel/everyinc/explore/term/inner-shadows-638084c3ecde'
markdown: >-
  https://liquidgold.cc/channel/everyinc/explore/term/inner-shadows-638084c3ecde.md
llms: null
parent: 'https://liquidgold.cc/channel/everyinc/llms.txt'
channel: everyinc
updated: '2026-10-23T22:12:35.346Z'
language: null
children: []
---


# \*\*inner shadows\*\*

Canonical: https://liquidgold.cc/channel/everyinc/explore/term/inner-shadows-638084c3ecde

Parent: [Channel index](https://liquidgold.cc/channel/everyinc/llms.txt)

## Definition

**Inner shadows** are a layer effect that draws a shadow inside the edges of a shape, making the element look inset or recessed — the opposite of a drop shadow, which falls outside the shape.

On the Monologue landing page built in **Framer**, inner shadows were part of the visual toolkit the Every design team used alongside **shaders**, **Rive animations**, and reusable components to give the page depth and polish while shipping fast. [^da326689-69f1-5b6c-9fe9-2bd3b415fcb6@0] An inner shadow is a *layer effect* that renders a shadow **inside** the edges of a shape rather than outside it, so the element appears inset, pressed, or recessed instead of lifted off the page. Designers reach for inner shadows when they want subtle dimensionality — think inset input fields, pressed buttons, or soft interior depth on cards — without the heavier look of a drop shadow. Because it is a per-layer effect, it can be applied, adjusted, and reused as part of a component so the same treatment stays consistent across a design.
