TTULAKITO
Designer

CSS Triangle Generator

Generate CSS-only triangles and arrows with adjustable direction.

All tools

Preview

CSS

.triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 60px 60px 60px;
  border-color: transparent transparent #3b82f6 transparent;
}

Frequently asked questions

Is CSS Triangle Generator free to use?
Yes. CSS Triangle Generator is part of TULAKITO's collection of free browser tools. No signup, no subscription, no usage limits.
Is my data safe with CSS Triangle Generator?
Yes. CSS Triangle Generator runs entirely in your browser. Nothing you type, paste, or upload is sent to any server.
Do I need to install anything?
No. CSS Triangle Generator works directly in your browser on desktop and mobile — no downloads or extensions required.