• EA Nysanov Республика Казахстан
  • S Tumashbaev Республика Казахстан


Introduction. This article discusses modern computer graphics and CSS animation, is an auxiliary material to the practical lesson on computer graphics. A beginner animator working from nature, from memory and imagination can not neglect the conditions of the tonal construction of this object. Proper construction of the tonal range in accordance with the set creative task- an important condition for the creation of this animated work with the use of CSS tools. In this material plays a big role in flowering. Therefore, we offer special exercises designed to assimilate the initial knowledge of the methods of constructing the tonal structure of modern computer graphics and CSS animation. Tonal exercises are based on the method of gradual complication of tasks – from the compilation of simple details of flat geometric shapes to the development of achromatic images. This article is proposed for use by teachers and students in theoretical and practical classes in computer graphics and animation, also when working in the open air practice. Light-density relations of colors have long been the subject of careful study and programmers, animators, and Methodists in this area. It is known that the same color tones, taken in different light-density relations, produce a very different emotional impression on us. Professional animator dealing with color, it is extremely important to identify the role and importance of light-density relationships of colors and ways of their construction. Looking through the well-known programs of modern computer graphics and CSS animation, we are amazed at how coloristic animation is built holistically. Each detail works on its General ideological content, each color spot seems deeply thought out, calculated by tone and area relative to the size of the whole. In such animations it is impossible not to add or reduce a single color spot. Here, form and color are in one harmony. One of the conditions of such sounding is competent construction of the General tonal basis of animation, finding of the optimum sizes of the area of each spot in their contrast combination. How to animate? CSS - transition property animation. There are two main tools in CSS that we can use to move elements around a web page. The first property is the transition. First of all, it is with its help that we create animations in CSS. The second tool is the animation property paired with keyframes (@keyframes – keyframes). Now we will look at the CSS transition property. And we'll talk about what you need to animate on the page (when the user needs it), and what not to animate (when the animation looks stupid and inappropriate), based on the user experience (UX — user experience). CSS transition property-HTML and CSS parameters and values. transition: [property] [duration] [timing function] [delay];


1. V.Petkov. Animacija dlja specifikacii CSS3. KompjuterPress, 2001. – 224 s.

2. Jeffektivnaja rabota: Animacija dlja specifikacii CSS3. A.A. Tajc, A.M. Tajc, M.N. Petrov. – SPb.: Piter, 2003. – 768 s.: il.

3. Retushirovanie i obrabotka izobrazhenija v animacii dlja specifikacii CSS3. / Ajsmann Kjetrin.: Per. s angl. – M.: Izdatelskij dom «Viljams», 2003. – 304 s.: il. – Paral. tit. angl.

4. A.Tajc. Animacija dlja specifikacii CSS3. Moskva, Piter, 2003

5. T.Buljanica Dizajn na kompjutere: Samouchitel. – SPb.: Piter, 2003.

6. D.Aderking, Retush i vosstanovlenie fotografij, Moskva, „Dialektika“, 2000.

7. L.A.Zalogova Kompjuternaja grafika. Jelektivnyj kurs: -M.: BINOM. Laboratorija znanij, 2005 g.



How to Cite

Nysanov, E., & Tumashbaev, S. (2019). THE USE OF CSS ANIMATIONS IN CSS3. Pridneprovskiy Scientific Bulletin, 3(611). Retrieved from