Unit Circle Explorer

Interactive unit circle: drag the angle and see sin, cos, tan values update live. Visual trigonometry learning.

How to Use Unit Circle Explorer

1

Drag the angle

Move the point around the unit circle to set an angle.
2

View trig values

See sine, cosine, tangent, and other values update in real time.
3

Study the relationships

Observe how angle changes affect all trigonometric functions.

Tested tool guide Tested browser tools Checked August 16, 2026

What Unit Circle Explorer does, with a checked example

The Unit Circle Explorer draws a circle of radius 1 centered on the origin and places a movable point on its rim. Drag the point, or type an angle, and the tool reads the point's coordinates as cosine and sine, then divides them for tangent, updating all three live. The surprise most users hit first: the angle is measured counterclockwise from the positive x-axis, so 0 degrees sits at 3 o'clock, not 12. And the coordinates come out as (cos, sin) - the horizontal value is cosine, the vertical value is sine - which is easy to get backwards.

Worked example

A concrete input and expected output from the current implementation.

Input

Set the angle to 30 degrees (drag the point to the 30-degree mark).

Expected output

cos 30 degrees = 0.866, sin 30 degrees = 0.5, tan 30 degrees = 0.577. The point sits at (0.866, 0.5).

On a unit circle the point at angle theta is exactly (cos theta, sin theta). At 30 degrees the 30-60-90 triangle gives sin = 1/2 and cos = sqrt(3)/2, and tan = sin / cos = 1/sqrt(3), which rounds to 0.577.

How the result is produced

What the circle encodes

Every point on a circle of radius 1 has coordinates (cos theta, sin theta) for some angle theta measured counterclockwise from the positive x-axis. Dragging the point along the rim changes theta, so the readout is a live table of trig values. Tangent is not a coordinate of the point: it is the ratio sin / cos, shown as a third value.

Signs, quadrants, and the tangent asymptote

In quadrant I (0-90 degrees) both coordinates are positive; in quadrant II (90-180) sine stays positive while cosine turns negative, so tangent - the ratio - turns negative too. The pattern mirrors through quadrants III and IV. At exactly 90 and 270 degrees, cosine is zero and tangent is undefined; the readout has no finite value to show there.

Good uses

Confirm the exact values you memorized for 30, 45, and 60 degrees: drag to each angle and check sin and cos against sqrt(3)/2, sqrt(2)/2, and 1/2.
Settle sign confusion: drag through 90 to 180 degrees and watch tan flip negative while sin stays positive, making it visible why tan 150 degrees equals -tan 30 degrees.
Read degrees and radians side by side while learning the radian scale: drag from 0 to 180 degrees and confirm that pi, pi/2, and pi/3 line up with 180, 90, and 60 degrees.

Limits and checks

Zero position: 0 degrees is at 3 o'clock, not 12. If you expect angles measured from the top of the circle, every value you read will be shifted by 90 degrees.
Rounded values: a displayed 0.866 is sqrt(3)/2 cut to three decimals, and 0.577 is 1/sqrt(3). Near 90 degrees, tan readings climb without bound and become unstable, because the exact value is undefined.
Coordinate pairing: the point is (cos, sin), not (sin, cos). Swapping the two when reading coordinates makes the values disagree with the position you see on screen.

Common questions

Why does tan show a gigantic number near 90 degrees and a negative one right after?

Tangent is sin divided by cos, and cos approaches zero as the angle approaches 90 degrees, so the ratio grows without bound. Just past 90 degrees, cos is negative while sin is still positive, so tan jumps from huge positive to huge negative; it is not continuous across 90 degrees. At exactly 90 degrees, tan is undefined.

Why is sin 150 degrees the same as sin 30 degrees?

Sine is the vertical coordinate of the point on the circle. The points at 30 and 150 degrees sit at the same height above the x-axis, so their y-coordinates - and therefore their sine values - match. Their x-coordinates have opposite signs, which is why cos 150 degrees equals -cos 30 degrees.

References and verification

The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.