ContextQMD
Back to Remotion

Triangle

packages/docs/docs/shapes/triangle.mdx

4.0.464777 B
Original Source

import {ShapeSeeAlso, ShapeOptions} from "../../components/shapes/shapes-info"

Part of the @remotion/shapes package.

Renders an SVG element containing a triangle with same length on all sides.

Explorer

<Demo type="triangle" />

Example

tsx
import { Triangle } from "@remotion/shapes";
import { AbsoluteFill } from "remotion";

export const MyComposition = () => {
  return (
    <AbsoluteFill
      style={{
        backgroundColor: "white",
        justifyContent: "center",
        alignItems: "center",
      }}
    >
      <Triangle length={100} fill="red" direction="left" />
    </AbsoluteFill>
  );
};

Props

<ShapeOptions shape="triangle" all />

See also

<ShapeSeeAlso shape="triangle"/>