Expressive 3D Charac

Moodi is a playful, customizable character component designed to bring personality and interaction to Framer websites.

Choose between multiple rounded shapes and expressions, then customize the character’s body color, highlights, face, eyes, pupils, proportions, lighting, gloss, depth, and shadow. Every important visual setting is available directly from Framer’s properties panel.

Moodi’s eyes respond to cursor movement while keeping the pupils naturally constrained inside the eye area. Optional automatic blinking makes the character feel more alive, and visitors can click the character to cycle through its expressions.

The component automatically adapts to its frame, making it suitable for desktop, tablet, and mobile layouts. It works especially well in landing-page heroes, empty states, onboarding experiences, product showcases, playful portfolios, creative agencies, and interactive call-to-action sections.

No external images, APIs, accounts, textures, or model files are required. The entire character is generated directly inside the component, making it easy to recolor, resize, reuse, and adapt across different projects.

Key features

• Three character shapes

• Twelve facial expressions

• Cursor-tracking pupils

• Constrained and natural eye movement

• Automatic blinking

• Click-to-cycle expressions

• Responsive sizing

• Custom body and highlight colors

• Editable face, eye, and pupil colors

• Adjustable eye size and spacing

• Adjustable pupil and eyebrow size

• Editable mouth and face positioning

• Adjustable gloss and dimensional depth

• Custom light position

• Configurable ground shadow

• Transparent background option

• Accessibility label

• No external assets or services