# blinds-open icon Blinds open. Gentleface icon, drawn on the 16 px pixel grid. Free, MIT licensed. Page: https://gentleface.com/icons/blinds-open - Category: Home & household - Use it for: open blinds, raise blinds, blinds up, open curtains - Tags: blinds, open blinds, raise blinds, raised, window blind, shades, roller blind, window covering, smart home - Family: blinds - Component name: BlindsOpenIcon - Added: 2026-11-12 ## Alternatives - `blinds`: the lowered or closed state ## Also fits - blinds: the raised or opened state ## Files Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too. - line-round: https://gentleface.com/svg/line-round/16/blinds-open.svg · PNG https://gentleface.com/png/line-round/16/blinds-open.png · https://gentleface.com/png/line-round/32/blinds-open.png · https://gentleface.com/png/line-round/48/blinds-open.png - line-soft: https://gentleface.com/svg/line-soft/16/blinds-open.svg · PNG https://gentleface.com/png/line-soft/16/blinds-open.png · https://gentleface.com/png/line-soft/32/blinds-open.png · https://gentleface.com/png/line-soft/48/blinds-open.png - line-sharp: https://gentleface.com/svg/line-sharp/16/blinds-open.svg · PNG https://gentleface.com/png/line-sharp/16/blinds-open.png · https://gentleface.com/png/line-sharp/32/blinds-open.png · https://gentleface.com/png/line-sharp/48/blinds-open.png - solid-round: https://gentleface.com/svg/solid-round/16/blinds-open.svg · PNG https://gentleface.com/png/solid-round/16/blinds-open.png · https://gentleface.com/png/solid-round/32/blinds-open.png · https://gentleface.com/png/solid-round/48/blinds-open.png - solid-soft: https://gentleface.com/svg/solid-soft/16/blinds-open.svg · PNG https://gentleface.com/png/solid-soft/16/blinds-open.png · https://gentleface.com/png/solid-soft/32/blinds-open.png · https://gentleface.com/png/solid-soft/48/blinds-open.png - solid-sharp: https://gentleface.com/svg/solid-sharp/16/blinds-open.svg · PNG https://gentleface.com/png/solid-sharp/16/blinds-open.png · https://gentleface.com/png/solid-sharp/32/blinds-open.png · https://gentleface.com/png/solid-sharp/48/blinds-open.png The SVG of every style: https://gentleface.com/icons/blinds-open.json (`svg`). ## Code (line-round) The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. For another style, take its SVG from the JSON and swap the path `d`. ### SVG ```svg ``` ### React ```tsx // Gentleface "blinds-open" (line-round), MIT. https://gentleface.com/icons/blinds-open import type { SVGProps } from 'react'; export function BlindsOpenIcon(props: SVGProps) { return ( ); } ``` ### Vue ```vue ``` ### Svelte ```svelte ``` ### HTML img ```html

``` ### CSS ```css /* Gentleface "blinds-open" (line-round), MIT. https://gentleface.com/icons/blinds-open. Takes the text color. */ .icon-blinds-open { display: inline-block; width: 16px; height: 16px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L13.5 1C13.641 1 13.759 1.048 13.856 1.144C13.952 1.241 14 1.359 14 1.5C14 1.641 13.952 1.759 13.856 1.856C13.759 1.952 13.641 2 13.5 2L13 2L13 5C13 5.276 12.902 5.512 12.707 5.707C12.512 5.902 12.276 6 12 6L8 6L8 12C8.276 12 8.512 12.098 8.707 12.293C8.902 12.488 9 12.724 9 13L9 14C9 14.276 8.902 14.512 8.707 14.707C8.512 14.902 8.276 15 8 15L7 15C6.724 15 6.488 14.902 6.293 14.707C6.098 14.512 6 14.276 6 14L6 13C6 12.724 6.098 12.488 6.293 12.293C6.488 12.098 6.724 12 7 12L7 6L3 6C2.724 6 2.488 5.902 2.293 5.707C2.098 5.512 2 5.276 2 5L2 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM12 3L12 2L3 2L3 3L12 3ZM12 5L12 4L3 4L3 5L12 5Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L13.5 1C13.641 1 13.759 1.048 13.856 1.144C13.952 1.241 14 1.359 14 1.5C14 1.641 13.952 1.759 13.856 1.856C13.759 1.952 13.641 2 13.5 2L13 2L13 5C13 5.276 12.902 5.512 12.707 5.707C12.512 5.902 12.276 6 12 6L8 6L8 12C8.276 12 8.512 12.098 8.707 12.293C8.902 12.488 9 12.724 9 13L9 14C9 14.276 8.902 14.512 8.707 14.707C8.512 14.902 8.276 15 8 15L7 15C6.724 15 6.488 14.902 6.293 14.707C6.098 14.512 6 14.276 6 14L6 13C6 12.724 6.098 12.488 6.293 12.293C6.488 12.098 6.724 12 7 12L7 6L3 6C2.724 6 2.488 5.902 2.293 5.707C2.098 5.512 2 5.276 2 5L2 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM12 3L12 2L3 2L3 3L12 3ZM12 5L12 4L3 4L3 5L12 5Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat; } ``` ### Data URL ```text data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L13.5 1C13.641 1 13.759 1.048 13.856 1.144C13.952 1.241 14 1.359 14 1.5C14 1.641 13.952 1.759 13.856 1.856C13.759 1.952 13.641 2 13.5 2L13 2L13 5C13 5.276 12.902 5.512 12.707 5.707C12.512 5.902 12.276 6 12 6L8 6L8 12C8.276 12 8.512 12.098 8.707 12.293C8.902 12.488 9 12.724 9 13L9 14C9 14.276 8.902 14.512 8.707 14.707C8.512 14.902 8.276 15 8 15L7 15C6.724 15 6.488 14.902 6.293 14.707C6.098 14.512 6 14.276 6 14L6 13C6 12.724 6.098 12.488 6.293 12.293C6.488 12.098 6.724 12 7 12L7 6L3 6C2.724 6 2.488 5.902 2.293 5.707C2.098 5.512 2 5.276 2 5L2 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM12 3L12 2L3 2L3 3L12 3ZM12 5L12 4L3 4L3 5L12 5Z'/%3E%3C/svg%3E ``` ### Sprite ```html ``` ### SwiftUI ```swift // Gentleface "blinds-open" (line-round), MIT. https://gentleface.com/icons/blinds-open import SwiftUI struct BlindsOpenIcon: Shape { func path(in rect: CGRect) -> Path { var p = Path() p.move(to: CGPoint(x: 1.144, y: 1.856)) p.addCurve(to: CGPoint(x: 1, y: 1.5), control1: CGPoint(x: 1.048, y: 1.759), control2: CGPoint(x: 1, y: 1.641)) p.addCurve(to: CGPoint(x: 1.144, y: 1.144), control1: CGPoint(x: 1, y: 1.359), control2: CGPoint(x: 1.048, y: 1.241)) p.addCurve(to: CGPoint(x: 1.5, y: 1), control1: CGPoint(x: 1.241, y: 1.048), control2: CGPoint(x: 1.359, y: 1)) p.addLine(to: CGPoint(x: 13.5, y: 1)) p.addCurve(to: CGPoint(x: 13.856, y: 1.144), control1: CGPoint(x: 13.641, y: 1), control2: CGPoint(x: 13.759, y: 1.048)) p.addCurve(to: CGPoint(x: 14, y: 1.5), control1: CGPoint(x: 13.952, y: 1.241), control2: CGPoint(x: 14, y: 1.359)) p.addCurve(to: CGPoint(x: 13.856, y: 1.856), control1: CGPoint(x: 14, y: 1.641), control2: CGPoint(x: 13.952, y: 1.759)) p.addCurve(to: CGPoint(x: 13.5, y: 2), control1: CGPoint(x: 13.759, y: 1.952), control2: CGPoint(x: 13.641, y: 2)) p.addLine(to: CGPoint(x: 13, y: 2)) p.addLine(to: CGPoint(x: 13, y: 5)) p.addCurve(to: CGPoint(x: 12.707, y: 5.707), control1: CGPoint(x: 13, y: 5.276), control2: CGPoint(x: 12.902, y: 5.512)) p.addCurve(to: CGPoint(x: 12, y: 6), control1: CGPoint(x: 12.512, y: 5.902), control2: CGPoint(x: 12.276, y: 6)) p.addLine(to: CGPoint(x: 8, y: 6)) p.addLine(to: CGPoint(x: 8, y: 12)) p.addCurve(to: CGPoint(x: 8.707, y: 12.293), control1: CGPoint(x: 8.276, y: 12), control2: CGPoint(x: 8.512, y: 12.098)) p.addCurve(to: CGPoint(x: 9, y: 13), control1: CGPoint(x: 8.902, y: 12.488), control2: CGPoint(x: 9, y: 12.724)) p.addLine(to: CGPoint(x: 9, y: 14)) p.addCurve(to: CGPoint(x: 8.707, y: 14.707), control1: CGPoint(x: 9, y: 14.276), control2: CGPoint(x: 8.902, y: 14.512)) p.addCurve(to: CGPoint(x: 8, y: 15), control1: CGPoint(x: 8.512, y: 14.902), control2: CGPoint(x: 8.276, y: 15)) p.addLine(to: CGPoint(x: 7, y: 15)) p.addCurve(to: CGPoint(x: 6.293, y: 14.707), control1: CGPoint(x: 6.724, y: 15), control2: CGPoint(x: 6.488, y: 14.902)) p.addCurve(to: CGPoint(x: 6, y: 14), control1: CGPoint(x: 6.098, y: 14.512), control2: CGPoint(x: 6, y: 14.276)) p.addLine(to: CGPoint(x: 6, y: 13)) p.addCurve(to: CGPoint(x: 6.293, y: 12.293), control1: CGPoint(x: 6, y: 12.724), control2: CGPoint(x: 6.098, y: 12.488)) p.addCurve(to: CGPoint(x: 7, y: 12), control1: CGPoint(x: 6.488, y: 12.098), control2: CGPoint(x: 6.724, y: 12)) p.addLine(to: CGPoint(x: 7, y: 6)) p.addLine(to: CGPoint(x: 3, y: 6)) p.addCurve(to: CGPoint(x: 2.293, y: 5.707), control1: CGPoint(x: 2.724, y: 6), control2: CGPoint(x: 2.488, y: 5.902)) p.addCurve(to: CGPoint(x: 2, y: 5), control1: CGPoint(x: 2.098, y: 5.512), control2: CGPoint(x: 2, y: 5.276)) p.addLine(to: CGPoint(x: 2, y: 2)) p.addLine(to: CGPoint(x: 1.5, y: 2)) p.addCurve(to: CGPoint(x: 1.144, y: 1.856), control1: CGPoint(x: 1.359, y: 2), control2: CGPoint(x: 1.241, y: 1.952)) p.closeSubpath() p.move(to: CGPoint(x: 12, y: 3)) p.addLine(to: CGPoint(x: 12, y: 2)) p.addLine(to: CGPoint(x: 3, y: 2)) p.addLine(to: CGPoint(x: 3, y: 3)) p.addLine(to: CGPoint(x: 12, y: 3)) p.closeSubpath() p.move(to: CGPoint(x: 12, y: 5)) p.addLine(to: CGPoint(x: 12, y: 4)) p.addLine(to: CGPoint(x: 3, y: 4)) p.addLine(to: CGPoint(x: 3, y: 5)) p.addLine(to: CGPoint(x: 12, y: 5)) p.closeSubpath() return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16)) } } // BlindsOpenIcon().frame(width: 16, height: 16) fills with the foreground style. Keep it on whole points to stay crisp. ``` ### Compose ```kotlin // Gentleface "blinds-open" (line-round), MIT. https://gentleface.com/icons/blinds-open import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.SolidColor import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.graphics.vector.addPathNodes import androidx.compose.ui.unit.dp val BlindsOpenIcon: ImageVector by lazy { ImageVector.Builder( name = "blinds-open", defaultWidth = 16.dp, defaultHeight = 16.dp, viewportWidth = 16f, viewportHeight = 16f, ).addPath( pathData = addPathNodes("M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L13.5 1C13.641 1 13.759 1.048 13.856 1.144C13.952 1.241 14 1.359 14 1.5C14 1.641 13.952 1.759 13.856 1.856C13.759 1.952 13.641 2 13.5 2L13 2L13 5C13 5.276 12.902 5.512 12.707 5.707C12.512 5.902 12.276 6 12 6L8 6L8 12C8.276 12 8.512 12.098 8.707 12.293C8.902 12.488 9 12.724 9 13L9 14C9 14.276 8.902 14.512 8.707 14.707C8.512 14.902 8.276 15 8 15L7 15C6.724 15 6.488 14.902 6.293 14.707C6.098 14.512 6 14.276 6 14L6 13C6 12.724 6.098 12.488 6.293 12.293C6.488 12.098 6.724 12 7 12L7 6L3 6C2.724 6 2.488 5.902 2.293 5.707C2.098 5.512 2 5.276 2 5L2 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM12 3L12 2L3 2L3 3L12 3ZM12 5L12 4L3 4L3 5L12 5Z"), fill = SolidColor(Color.Black), ).build() } // Icon(BlindsOpenIcon, contentDescription = null) tints it with LocalContentColor. ``` ### Android XML ```xml ``` ### Flutter ```dart // Gentleface "blinds-open" (line-round), MIT. https://gentleface.com/icons/blinds-open import 'package:flutter/widgets.dart'; class BlindsOpenIcon extends StatelessWidget { const BlindsOpenIcon({super.key, this.size = 16, this.color}); final double size; final Color? color; @override Widget build(BuildContext context) => CustomPaint( size: Size.square(size), painter: _BlindsOpenIconPainter(color ?? IconTheme.of(context).color ?? const Color(0xFF000000)), ); } class _BlindsOpenIconPainter extends CustomPainter { _BlindsOpenIconPainter(this.color); final Color color; @override void paint(Canvas canvas, Size size) { canvas.scale(size.width / 16, size.height / 16); final p = Path() ..moveTo(1.144, 1.856) ..cubicTo(1.048, 1.759, 1, 1.641, 1, 1.5) ..cubicTo(1, 1.359, 1.048, 1.241, 1.144, 1.144) ..cubicTo(1.241, 1.048, 1.359, 1, 1.5, 1) ..lineTo(13.5, 1) ..cubicTo(13.641, 1, 13.759, 1.048, 13.856, 1.144) ..cubicTo(13.952, 1.241, 14, 1.359, 14, 1.5) ..cubicTo(14, 1.641, 13.952, 1.759, 13.856, 1.856) ..cubicTo(13.759, 1.952, 13.641, 2, 13.5, 2) ..lineTo(13, 2) ..lineTo(13, 5) ..cubicTo(13, 5.276, 12.902, 5.512, 12.707, 5.707) ..cubicTo(12.512, 5.902, 12.276, 6, 12, 6) ..lineTo(8, 6) ..lineTo(8, 12) ..cubicTo(8.276, 12, 8.512, 12.098, 8.707, 12.293) ..cubicTo(8.902, 12.488, 9, 12.724, 9, 13) ..lineTo(9, 14) ..cubicTo(9, 14.276, 8.902, 14.512, 8.707, 14.707) ..cubicTo(8.512, 14.902, 8.276, 15, 8, 15) ..lineTo(7, 15) ..cubicTo(6.724, 15, 6.488, 14.902, 6.293, 14.707) ..cubicTo(6.098, 14.512, 6, 14.276, 6, 14) ..lineTo(6, 13) ..cubicTo(6, 12.724, 6.098, 12.488, 6.293, 12.293) ..cubicTo(6.488, 12.098, 6.724, 12, 7, 12) ..lineTo(7, 6) ..lineTo(3, 6) ..cubicTo(2.724, 6, 2.488, 5.902, 2.293, 5.707) ..cubicTo(2.098, 5.512, 2, 5.276, 2, 5) ..lineTo(2, 2) ..lineTo(1.5, 2) ..cubicTo(1.359, 2, 1.241, 1.952, 1.144, 1.856) ..close() ..moveTo(12, 3) ..lineTo(12, 2) ..lineTo(3, 2) ..lineTo(3, 3) ..lineTo(12, 3) ..close() ..moveTo(12, 5) ..lineTo(12, 4) ..lineTo(3, 4) ..lineTo(3, 5) ..lineTo(12, 5) ..close(); canvas.drawPath(p, Paint()..color = color); } @override bool shouldRepaint(_BlindsOpenIconPainter old) => old.color != color; } ```