---
title: "Diagonal Lines — Free Framer component · Best of Framer"
description: "Free Framer component · by Javlonbek · Backgrounds. About this Component The Diagonal Lines component adds a sleek, repeating diagonal line pattern to your projects."
canonical: "https://framer.elliotli.dev/component/diagonal-lines"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Diagonal Lines

# Diagonal Lines

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

![Diagonal Lines preview image 1](https://framer.elliotli.dev/og/component/diagonal-lines/1ba3a6770e5691a9/1600x1200.jpg)

## Summary

About this Component The Diagonal Lines component adds a sleek, repeating diagonal line pattern to your projects.

## Description

## About this Component

The Diagonal Lines component adds a sleek, repeating diagonal line pattern to your projects. Built with SVG and optimized for performance, it’s perfect for backgrounds, overlays, or subtle textures in your designs. With fully adjustable settings, you can easily customize colors, opacity, and styling to fit your project’s look.

## Adjustable Properties

-   Background Color
    
-   Pattern Color
    
-   Pattern Opacity
    

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

-   All · #5716

## Details

- **Author**: Javlonbek
- **Published**: 2025-09-26
- **Updated**: 2025-09-25
- **Added**: 2025-09-13
- **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