---
title: "Flocking Birds — Free Framer component · Best of Framer"
description: "Free Framer component · by Forrest Young · Backgrounds. Adjustable flock of birds"
canonical: "https://framer.elliotli.dev/component/flocking-birds"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Flocking Birds

# Flocking Birds

Adjustable flock of birds

[View on Framer](https://framer.com/marketplace/components/flocking-birds/?via=elliot-li)

![Flocking Birds preview image 1](https://framer.elliotli.dev/og/component/flocking-birds/21e5d8d5126e1336/1600x1439.jpg)

## Summary

Adjustable flock of birds

## Description

## Core Features & Capabilities

-   **Full Marketplace Compliance:** Includes Framer’s `useIsStaticRenderer()` hook to safely bypass WebGL loops during SSR/SSG site exports, canvas thumbnails, or static editor frames, rendering a lightweight vector SVG placeholder instead.
    
-   **Realistic Flapping Animation:** Dynamically alters the Y-position of individual wing vertices based on each bird's instant velocity—faster birds flap harder and quicker.
    
-   **Interactive Mouse Target:** The swarm reacts organically to cursor movement, drawing the flock toward or repelling them from the user's mouse position in 3D space.
    
-   **Responsive Canvas:** Uses `ResizeObserver` to cleanly recalculate camera aspect ratios and WebGL buffer sizes without reliance on window global events.
    

## Customizable Property Controls (Framer Panel)

**Property ControlTypeDefaultDescriptionBird Count**Number Slider Controls the swarm population density (`20` to `400`).

**Bird Scale** Number Slider Adjusts the individual 3-triangle mesh size (`0.2` to `3.0`).

**Max Speed** Number Slider Sets the terminal velocity cap of the entities (`1.0` to `10.0`).

**Attraction** Number Slider Adjusts cohesive pull between neighboring birds and cursor target.

**Background Color** Color Picker Sets the underlying canvas background color.

**Bird Color** Color Picker Changes the primary shade applied to the bird meshes.

**Wireframe** Boolean Toggle Toggles between solid shaded geometry and glowing wireframe

## Rank history [How rankings work →](/terms#rankings)

-   All · #5711

## Details

- **Author**: Forrest Young
- **Published**: 2026-07-29
- **Updated**: 2026-07-29
- **Added**: 2026-07-29
- **Categories**: Backgrounds

## More like this

-   [Pixel Flicker](/component/pixel-flicker) — Design Foundry · $10 — premium animated pixel background
-   [Fractal Glass Wave](/component/fractal-glass-wave) — Hienn Ng · $3 — Dynamic Fractal Glass Background
-   [Particle Flow Pro](/component/particle-flow-pro) — Interface Studio · $10 — Bring Your Background to Life
-   [Silk Gradient](/component/silk-gradient) — Kaisa A · Free — Silk Gradient Background
