Skip to content

component

TerminalUI

By Hamim Reza

Details

Summary

terminal window with typing fx

Description

An animated terminal window with realistic typing animation, sequential line reveals, and full macOS-style chrome. Mix typing and instant lines in any order. Trigger on scroll into view or page load. Built for developer portfolios, documentation pages, SaaS landing pages, and any interface that needs a realistic CLI experience. Features Realistic terminal chrome — red, yellow, green dot controls Two animation types — typing (character by character) and instant line reveal Mix typing and instant lines in any order Sequential animation — each line waits for the previous to complete Start on view — trigger animation when scrolled into viewport Up to 30 terminal lines supported Four text tone presets per line — text, muted, success, info Optional prefix per line — supports "> " · "$ " or any custom prefix Configurable typing speed (5–120ms per character) Configurable delay between sequential lines (0–1000ms) Full color controls — background, border, header, all text tones Custom dot colors — red, yellow, green Full typography controls — size, weight, spacing, line height Radius, padding and line gap controls Static preview in Framer canvas — no animation during export Accessible — ARIA labels and semantic HTML No dependencies SEO Keywords framer terminal component · framer terminal UI · framer code terminal · framer typing animation · framer CLI component · framer terminal window · framer developer component · framer code window · framer animated terminal · framer command line · framer typing effect · framer tech component · framer sequential animation · framer code component · framer developer portfolio

Introduction

terminal window with typing fx

Rank history

Daily rank per list, from the first snapshot — lower is better.

11001200120468/148/228/309/79/15
  • All · #1969