← LAB SINE · COSINE · TANGENT an interactive lesson
01TRIGONOMETRY · FROM SCRATCH

Meet Sine, Cosine & Tangent

Sine, cosine, and tangent all come from one right triangle. This page builds them up one idea at a time, and every step has something to play with. By the end they should feel simple, because they are.

These three words scare a lot of people. They shouldn't. Sine, cosine, and tangent all come from one picture: a triangle with a square corner. We build them up one step at a time, and every step has a box to play with. You don't need any earlier math. By the end they will feel obvious.

Step 1

An angle

Before sine or cosine, we need one thing: an angle.

Picture two straight lines meeting at a point, like the hands of a clock. How far open they are is the angle, and we measure it in degrees. A square corner is 90°, a flat straight line is 180°, and all the way around is 360°.

Drag the slider, or tap a preset, and watch the opening grow.

for the curious

Mathematicians often use radians instead of degrees. A full turn is radians instead of 360 degrees. Same angle, different ruler. Radians come back at the circle in Step 6.

Step 2

The triangle's three sides

Now draw a triangle with one square corner, the 90° kind. That is a right triangle.

Pick one of the other corners and call its angle θ ("theta"). From θ's point of view, the three sides get names:

hypotenuse: the long slanted side, always opposite the square corner.
opposite: the side that faces θ from across the triangle.
adjacent: the side θ sits right next to.

The picture shows each side's length. We give the hypotenuse a length of 1, then measure the other two sides against it. Those two measurements are sine and cosine.

Drag θ. The names never move. The opposite always faces θ, the adjacent always touches it.

Step 3

Sine

Sine is a measurement. Set the longest side to length 1, then measure the opposite side. That length is the sine.

sin θ = opposite ÷ hypotenuse = 0.50 ÷ 1 = 0.50

The number comes straight off the triangle. When θ is small the opposite side is short, so sine is near 0. When θ is close to a square corner the opposite side is almost the whole hypotenuse, so sine is near 1.

Drag θ and read the opposite side's length in the picture. That length is sin θ.

Step 4

Cosine

Cosine is the other measurement. Same triangle, longest side still 1. This time measure the adjacent side, the one right next to θ.

cos θ = adjacent ÷ hypotenuse = 0.87 ÷ 1 = 0.87

When θ is small the triangle is wide, so the adjacent side is long and cosine is near 1. As θ opens up that side shrinks and cosine drops toward 0. So as θ grows, sine goes up while cosine goes down.

Drag θ and watch both numbers. One rises as the other falls.

Step 5

Tangent

Tangent is the steepness. It compares how fast the triangle rises against how far it runs.

Tangent compares the two sides directly: the opposite divided by the adjacent. It tells you how steep the slope is.

tan θ = opposite ÷ adjacent = 0.50 ÷ 0.87 = 0.58

This is the same as sin θ ÷ cos θ. A flat triangle has a small tangent. As θ nears a square corner the opposite side towers over the adjacent side, so tangent gets very large.

Push θ toward 85° and watch tan θ shoot up.

for the curious

At exactly 90° the adjacent side is 0. Dividing by zero is undefined, so tangent has no value there. It is the only one of the three with a gap like this. You can understand waves without ever using it.

Step 6

The unit circle

Put that same triangle inside a circle with a radius of 1, so the hypotenuse is always 1. As θ turns, the dot slides around the circle.

The dot's height above the middle is sin θ. Its distance across is cos θ. So the circle is just every angle's sine and cosine, shown at once.

Where does the wave come from? Watch only the height, and ignore left and right. As the dot goes around, its height rises to the top, back to the middle, down to the bottom, and back again. Write that height down moment by moment, moving a little to the right each time. Those marks line up into the curve on the right.

Why isn't it a circle? A circle needs two numbers, across and up. The wave keeps only one of them, the height, and spreads it out over time. One number over time cannot loop back into a circle. It just goes up and down. That up and down is a wave.

Press Spin it. The dot's height gets carried to the right and drawn as the wave.

Angle θ30°
sin θ (height)0.500
cos θ (across)0.866
show cosine too
show triangle
radians
recap

The whole story, in three lines

sineopposite ÷ hypotenusethe height
cosineadjacent ÷ hypotenusethe width
tangentopposite ÷ adjacent = sin ÷ costhe steepness

Three ratios from one triangle. On the unit circle, sine is the height and cosine is the across. That lets them work for any angle, and drawn over time they make a wave. That is all there is to it.

last idea

A sine wave is also a sound

The wave isn't only a shape you draw. It is also a sound you can hear.

A speaker pushes the air back and forth. If it pushes in the shape of a sine wave, a few hundred times a second, your ear hears a clear musical note. A faster wave is a higher note. A taller wave is a louder one.

Nothing here is recorded. The computer builds the wave from the same sine you just learned and sends it to your speaker. The line in the box is that exact wave, drawn as it plays.

sine
NoteA4
Wave repeats440 times / sec

Press Play a note, then drag the pitch slider. The wave in the box gets tighter as the note goes higher. Tighter wave, faster repeat, higher sound.

Then press Play a little tune. Every note in it is just a sine wave at a different pitch, one after another.