ईस्टर बनी ड्रा


14

इस खुशहाल व्यक्ति को लोकगीत में ईस्टर बनी के नाम से जाना जाता है।

ईस्टर बनी

रंग की

यह 4 रंगों का उपयोग करके बनाया गया है:

  • हल्का गुलाबी
  • गहरे गुलाबी
  • सफेद
  • काली

(मैं इन रंगों को आपके उत्तर में समेटने के लिए खुश हूं। यह सटीक छाया होने की आवश्यकता नहीं है)

आकृतियाँ

यह इन आकृतियों से निर्मित है:

  • हल्के गुलाबी (बाहरी कान) में दो लम्बे दीर्घवृत्त। उनकी समान ऊंचाई और चौड़ाई है।
  • गहरे गुलाबी (आंतरिक कान) में दो लम्बे दीर्घवृत्त। वे बाहरी कानों की तुलना में छोटे होते हैं और बाहरी कानों में से प्रत्येक के ऊपर एक खींचा जाता है। वे समान ऊँचाई और चौड़ाई वाले होते हैं।
  • हल्के गुलाबी (सिर) में एक बड़ा चक्र। यह दोनों बाहरी कानों के नीचे तीसरे (लेकिन अधिक नहीं) के साथ प्रतिच्छेद करता है।
  • सफेद (बाहरी आंखों) में दो वृत्त। उन्हें सिर पर खींचा जाता है। उनका व्यास बाहरी कानों की चौड़ाई से कम है। उनके पास बाहरी कान के समान क्षैतिज स्थिति है।
  • काली (आंतरिक आँखों) में दो वृत्त। उनके पास बाहरी आंखों की तुलना में एक छोटा व्यास है। प्रत्येक बाहरी आंखों पर एक खींचा जाता है।
  • काले (ऊपरी मुंह) में एक ऊर्ध्वाधर रेखा। यह सिर पर खींचा जाता है और बाहरी आंखों के नीचे से कम होता है। यह प्रत्येक आंख से लगभग बराबर है।
  • काले (निचले मुंह) में दो चाप। वे एक क्षैतिज रेखा से नीचे की ओर सिर और चाप पर बने होते हैं। दोनों ऊपरी मुंह के नीचे के साथ प्रतिच्छेद करते हैं, लेकिन एक दाएं जाता है और दूसरा बाएं जाता है।

नियम

  • अपनी पसंद की किसी भी भाषा और टूल का उपयोग करें।
  • आउटपुट एक छवि, html, svg, या अन्य मार्कअप हो सकता है।
  • यह कोड गोल्फ है, इसलिए इसे कम से कम बाइट्स में करने का लक्ष्य रखें।
  • कृपया परिणाम का स्क्रीनशॉट शामिल करें।
  • परिभाषित रंगों को अनुमानित करने के लिए स्वतंत्र महसूस करें।

हैप्पी ईस्टर!


आप किस आकार की छवि पसंद करेंगे?
नील

@ नील आकार कोई फर्क नहीं पड़ता, नील। जब तक यह आकार और रंग के लिए आवश्यकताओं को पूरा करता है।
AJFaraday

मुझे कामों में डिसमॉस का जवाब मिला है। क्या आंखों का सफेद होना स्वीकार्य नहीं है?
बेंजामिन अर्कहार्ट

@BenjaminUrquhart वास्तव में नहीं। यह प्रक्रिया को सरल करता है। यदि आप मदद करता है, तो आप इसे एक ग्रे बना सकते हैं।
AJFaraday

1
@BenjaminUrquhart मेरे लिए काम करता है
AJFaraday

जवाबों:


18

टी-एसक्यूएल, 445 439 बाइट्स

DECLARE @ GEOMETRY='MULTIPOINT((3 3),(7 3))',
@l GEOMETRY='CIRCULARSTRING(3 6,3.3 9,3 12,2.7 9,3 6)',@r GEOMETRY
SET @=@.STBuffer(.6)SET @r=@l.STUnion('CIRCULARSTRING(7 6,7.3 9,7 12,6.7 9,7 6)')
SELECT*FROM(VALUES(@),(@),(@),(@r.STBuffer(.3)),(@),(@),(@),(@),(@),(@),(@),(@),(@),
(@),(@),('CIRCULARSTRING(7 0,6 -1,5 0,5 1,5 1,5 0,5 0,4 -1,3 0)'),
(GEOMETRY::Point(5,1,0).STBuffer(5).STUnion(@r.STBuffer(1.3)).STDifference(@.STBuffer(.4)))
)a(g)

यह साइट अधिक T-SQL- आधारित चित्र का उपयोग कर सकती है!

SQL 2017 पर चलाएँ, लेकिन SQL 2008 में वापस जोड़े गए SQL भू-स्थानिक संग्रहण सुविधाओं का उपयोग करता है । लाइन ब्रेक केवल पठनीयता के लिए हैं।

आउटपुट:

यहाँ छवि विवरण दर्ज करें

इसलिए, यह टी-एसक्यूएल में करने के लिए एक दर्द था, क्योंकि स्थानिक वस्तुओं को ड्राइंग के लिए बिल्कुल नहीं बनाया गया है (उदाहरण के लिए कोई "दीर्घवृत्त" ऑब्जेक्ट)। इससे भी अधिक, रंगों को ठीक से करीब से पकड़ना भी थोड़ा परीक्षण और त्रुटि की आवश्यकता है।

मूल रूप से मैं निम्नलिखित ज्यामितीय वस्तुओं का निर्माण कर रहा हूँ:

  1. आंखें ( @), जो बिंदुओं का उपयोग करके डिस्क में विस्तारित हैं STBuffer(.6)(उन शुरुआती बिंदुओं के 0.6 के भीतर सभी बिंदुओं का सेट)
  2. कान ( @r), जो नुकीले घटता के रूप में उत्पन्न होते हैं, लेकिन STBufferआंतरिक या भीतरी कानों में उपयोग करके "फुफ्फुस" होते हैं
  3. चेहरा, जो एक डिस्क है और कान आंखों को छोटा करता है। मुझे इसका निर्माण करना है और इसे एक ही ऑब्जेक्ट के रूप में प्रदर्शित करना है, या SQL इसे विभिन्न रंगों में प्रदर्शित करेगा।
  4. मुंह, जो एक वक्र का उपयोग करके बनाया गया है CIRCULARSTRING

रंगों को सही तरीके से प्राप्त करने के लिए, मुझे उचित क्रम मेंSELECT इन पर काम करना होगा । एसएसएमएस में स्थानिक परिणाम फलक में प्रदर्शित वस्तुओं के लिए रंगों का एक अंतर्निहित अनुक्रम है , इसलिए गहरे गुलाबी आंतरिक कानों को 4 वें आना था , और हल्के गुलाबी चेहरे को 16 वें स्थान पर आना था । यह आंखों की अतिरिक्त प्रतियों की एक पूरी गुच्छा में डालने की आवश्यकता है, जो ठीक है क्योंकि हम उन्हें जितना संभव हो उतना काले रंग के करीब चाहते हैं (रंग कुछ पारदर्शी होते हैं, इसलिए उन्हें स्टैक करना उन्हें गहरा बनाता है)।

निम्नलिखित संसाधनों से सहायता और प्रेरणा:

EDIT : 4 इकाइयों द्वारा बन्नी को नीचे ले जाया गया, जो कुछ निर्देशांक को एक अंक में बदल देता है, जिससे 6 बाइट बचती हैं। प्रदर्शित आउटपुट में कोई परिवर्तन नहीं।


1
ज्यामिति वस्तुओं के साथ एक खरगोश का निर्माण, शानदार! xD
केविन क्रूज़सेन

9

लाल , 375 340 329 बाइट्स

Red[needs 'View]f: 'fill-pen p: 'pen e: 'ellipse c: 'circle
t:[5x5 0 180]view[base 200x200 #FFF draw
compose[(p)pink(f)pink(c)100x100 30(e)75x25
20x60(e)105x25 20x60(p)#E28(f)#E28(e)79x35 12x35(e)109x35
12x35(p)#FFF(f)#FFF(c)88x92 8(c)112x92 8(p)#000(f)#000(c)88x92
5(c)112x92 5 line 100x108 100x115 arc 95x115(t)arc 105x115(t)]]

यहाँ छवि विवरण दर्ज करें


7

डेसमोस, 262 चार्ट / बाइट्स

मेरा मतलब है, यह

कानों में भरने के लिए जावा: ^) +2 बाइट्स से छोटा है

// Face
x^2+y^2<=4 

// Ears (outer)
(x+1)^2+((y-3)^2)/4<=.5
(x-1)^2+((y-3)^2)/4<=.5

// Ears (inner)
(x+1)^2+((y-3)^2)/4<=.25
(x-1)^2+((y-3)^2)/4<=.25

// Pupils
(x+.7)^2+(y-.7)^2<=.1
(x-.7)^2+(y-.7)^2<=.1

// "Whites"
(x-.7)^2+(y-.7)^2<=.3
(x+.7)^2+(y-.7)^2<=.3

// Mouth
y+1=-{y<1:sqrt(.1-(x+.316)^2)}
y+1=-{y<1:sqrt(.1-(x-.316)^2)}
x={-1<y<-.5:0}

लिंक की गई ग्राफ़ लाइनों के साथ अक्षम किया गया (मुझे पता चला कि आप ऐसा कर सकते हैं):

Bunneh

Bunneh


मुझे यह जवाब पसंद है! हालांकि, अगर मुझे पांडित्य हो सकता है। बाहरी कान चेहरे के समान रंग होना चाहिए। भीतर गहरा होना चाहिए। इसके अलावा, क्या टिप्पणियाँ आपके चार गिनती में शामिल हैं? आप वहां से थोड़ी दूर जा सकते थे।
AJFaraday

1
टिप्पणियाँ @AJFaraday शामिल नहीं हैं। डेसमोस के पास एक ही स्थान पर अधिक समीकरणों को स्टैक करने के अलावा "गहरा" या "हल्का" बनाने का एक तरीका नहीं है (बाहरी कान चेहरे के btw के समान रंग है)।
बेंजामिन अर्कहार्ट

क्या यह सही है कि रंगों का चयन करते समय किसी भी बाइट का उपयोग नहीं किया जाता है? थोड़ा अनुचित लगता है ...?
स्टीवी ग्रिफिन

@StewieGriffin मुझे यकीन नहीं है कि रंगों को कैसे गिनना है। हो सकता है कि मैं इस पर एक मेटा पोस्ट खोल / पाऊं।
बेंजामिन अर्कहार्ट


6

रूबी शूज़ के साथ , 240 अक्षर

Shoes.app{['fcc',[0,40,60],[5,0,20,50],[35,0,20,50],'f99',[t=10,t,t,h=30],[40,t,t,h],'fff',[t,55,15],[35,55,15],'000',[14,58,7],[38,58,7]].map{|v|stroke fill v rescue oval *v}
nofill
line h,75,h,80
arc 25,80,t,t,0,3.14
arc 35,80,t,t,0,3.14}

नमूना उत्पादन:

ईस्टर बनी के साथ जूते की खिड़की स्क्रीनशॉट


6

पायथन, 368 बाइट्स

Matplotlib का उपयोग करना।

from matplotlib import pyplot as l,patches as p,transforms as t;z=0,;[l.gca().add_patch(p.Wedge(z*2,R,s,360,width=w,color=(r,o,o),transform=t.Affine2D.from_values(X,0,0,9,350+x*n,y*9)))for R,s,w,r,o,X,x,y in zip([11,7,15,4,2,2,99],z*5+(180,359),[None]*5+[.2,.4],(1,)*4+z*3,(.8,.6,.8,1)+z*3,[4,4]+[9]*5,[7,7,0,6,6,2,98.8],[51,51,30,35,35,24,26])for n in[-9,9]];l.show()

परिणाम: यहाँ छवि विवरण दर्ज करें

Ungolfed:

from matplotlib import pyplot, patches, transforms
z = 0, # store zero as a tuple for later repetition
for radius, startAngle, width, red, other, xStretch, x, y in \
    zip([11 ,7  ,15 ,4  ,2  ,2  ,99   ],  # radius
        z * 5 +             (180,359  ),  # start angle
        [None] * 5 +        [.2 ,.4   ],  # wedge width (None = full)
        (1,) * 4        +z * 3         ,  # red channel
        (.8 ,.6 ,.8 ,1) +z * 3         ,  # other color channels
        [4]*2 + [9]*5                  ,  # x stretch factor
        [ 7 ,7  ,0  ,6  ,6  ,2  ,98.8 ],  # x
        [51 ,51 ,30 ,35 ,35 ,24 ,26   ]): # y
#        |   |   |   |   |   |   |
#        |   |   |   |   |   |   "straight" line for upper mouth
#        |   |   |   |   |   |   approximated by large radius arc
#        |   |   |   |   |   |
#        |   |   |   |   |   Arc for lower mouth
#        |   |   |   |   |
#        |   |   |   |   Inner eye circle
#        |   |   |   |
#        |   |   |   Outer eye circle
#        |   |   |
#        |   |   Circle for head
#        |   |
#        |   Inner ear ellipse
#        |
#        Outer ear ellipse

    for n in [-9, 9]:        # draw left and right side mirrored
        pyplot.gca().add_patch( patches.Wedge(
            z*2,       # center = (0, 0), actual location set by the transform below
            radius,
            startAngle,
            360,       # end angle
            width = width,
            color = (red, other, other), # only red channel varies from the others
            transform = transforms.Affine2D.from_values( # affine transform matrix
                xStretch,    # x stretch factor
                0, 0,        # unused cross-axis coefficients for skew/rotation
                9,           # y stretch factor
                x * n + 350, # x value reflected by n, centered at 350
                y * 9 )))    # y value

pyplot.show()

5

जावास्क्रिप्ट, 381 326 बाइट्स

धन्यवाद अर्नोल्ड और महाकाव्य।

(d=document).body.appendChild(a=d.createElement`canvas`);b=a.getContext`2d`;'A707|A7,/|Z707|Z7,/|MZAA|CR--|UR--|CR**|UR**|Id**|Nd**|La(+'.split`|`.map(x=>x.split``.map(c=>c.charCodeAt()-40)).map((x,i)=>b[b.beginPath(b.fillStyle='#'+'fccf77fff000'.substr('030306699'[i],3)),b.ellipse(...x,0,0,3*-~(i<9)),i>8?'stroke':'fill']())



1
हाल ही में -6 के लिए एक संपादन प्रस्तुत किया।
एपिकनेस

यदि आप अपना उत्तर बदलने के लिए तैयार हैं तो आप HTML+JavaScriptHTML भाग <canvas id=A>और JS का पहला भाग बना सकते हैं b=A.getContext...- मैंने कुछ समय पहले आइसलैंड के अपने ध्वज में इसका उपयोग किया था। इस पोस्ट ने उस उत्तर को 2 बाइट्स से बचाया: :) codegolf.stackexchange.com/a/176852/8340
dana

एक बोनस के रूप में आप "स्टैक स्निपेट" को एम्बेड कर सकते हैं :) stackoverflow.blog/2014/09/16/…
dana

1
आप के साथ 3 और बाइट्स बचा सकते हैं (D=document).body.appendChild(a=D.createElement`canvas`)
अरनौलद

4

JavaScript + P5.js , 291 276 273 बाइट्स

इस समय के आसपास बहुत सारे छोटे बदलाव .. कि बाइट का आकार बिल्कुल भी नहीं बदलता है।

setup=_=>{createCanvas(u=400,u);(e=ellipse,f=fill)`#fcc`;e(u/=2,u,x=150,x);e(x+=10,z=99,50,z);e(w=240,z,50,z);f`#f77`;e(x,z,y=30,80);e(w,z,y,80);f``;e(w,v=180,y,y);e(x,v,y,y);f(0);e(w,v,y=9,y);e(x,v,y,y);noFill(line(u,225,u,250));arc(195,...a=[245,y,y,0,PI]);arc(205,...a)}

इसे ऑनलाइन आज़माएं!

स्पष्टीकरण:

setup = _ => { 
    createCanvas(u=400, u);                 // Create basic canvas.
    (e = ellipse, f = fill)`#fcc`;          // Light pink
    e(u /= 2, u, 150, 150);                 // These first few lines end up defining short-hand names for functions.
    e(x += 10, z = 99, 50, z);              // Throughout the code, you will see
    e(w = 240, z, 50, z);                   // lots of variable definitions.
    f`#f77`;                                // Dark pink
    e(x, z, y = 30, 80);                    // Another variable declaration
    e(w, z, y, 80);
    f``;                                    // Empty fill argument = white, apparently? (Eyes start here)
    e(w, v = 180, y, y);                    // I'll just stop commenting on declarations now
    e(x, v, y, y);
    f(0);                                   // fill(x) = fill(x, x, x)
    e(w, v, y = 9, y);
    e(x, v, y, y);
    noFill(line(u, 225, u, 250));           // Last part of bunny starts here.
                                            // Get rid of fill so the bunny doesn't look bad
    arc(195, ...a= [245, y, y, 0, PI]);
    arc(205, ...a)                          // arc() creates something similar to a semi-circle.
}

आप उपयोग कर सकते हैं #fccऔर #f77रंग के लिए।
ओव्स

खैर ... मुझे तब से कोई नई बाइट नहीं मिली। यह कहना सुरक्षित है कि मैंने इसे बहुत अधिक अनुकूलित किया है?
एपिकसिटी


4

प्रसंस्करण, 388 343 319 चार्ट / बाइट्स

बहुत सुंदर नहीं है, लेकिन यहाँ यह है। छवि को छोटा करके बाइट्स सहेजे गए।

int b=50,c=60,g=70;
noStroke();
//Face
fill(#FFCCCC);
ellipse(b,g,c,c);
//Outer ears
ellipse(40,25,15,b);
ellipse(c,25,15,b);
//Inner ears
fill(#FF9999);
ellipse(40,25,7,30);
ellipse(c,25,7,30);
//Outer eyes
fill(-1);
ellipse(40,g,10,10);
ellipse(c,g,10,10);
//Inner eyes
fill(0);
ellipse(40,g,5,5);
ellipse(c,g,5,5);
//Mouth
stroke(0);
line(b,80,b,85);
noFill();
arc(53,85,5,5,0,PI);
arc(48,85,5,5,0,PI);

यहाँ छवि विवरण दर्ज करें


मैंने यहां और वहां कुछ बाइट्स बचाए: 332 बाइट्स
Zylviij



@Zylviij ने आपके पास मौजूद कुछ विचारों का उपयोग किया और इसे 343 वर्णों तक सीमित कर दिया। मुझे नहीं लगता कि आप प्रसंस्करण में चर के लिए कार्य असाइन कर सकते हैं।
रॉबर्ट एस।

मैंने कभी भी व्यक्तिगत रूप से उपयोग या डाउनलोड करने की प्रक्रिया नहीं की है, लेकिन मैंने अपनी लिपियों का परीक्षण यहां किया और उन्होंने छवि या कंसोल में त्रुटियों का उत्पादन किए बिना काम किया
Zylviij

4

पोस्टस्क्रिप्ट , 688 484 468 439 बाइट्स

गोल्फ संस्करण:

80 60 translate 5 5 scale .2 setlinewidth 1 .7 .7 setrgbcolor 0 0 10 0 360 arc closepath fill /h {7 15 moveto 7 25 1 25 1 15 curveto 1 5 7 5 7 15 curveto closepath fill 1 .5 .5 setrgbcolor 6 15 moveto 6 22 2 22 2 15 curveto 2 8 6 8 6 15 curveto closepath fill 1 setgray 4 3 2 0 360 arc closepath fill 0 setgray 4 3 1 0 360 arc closepath fill 0 -3 moveto 0 -5 lineto stroke 1 -5 1 180 0 arc stroke}def gsave h grestore -1 1 scale h showpage

Ungolfed संस्करण:

80 60 translate                                     % over-all shift
5 5 scale                                           % over-all scale
.2 setlinewidth
1 .7 .7 setrgbcolor                                 % light pink
0 0 10 0 360 arc closepath fill                     % large circle for head
/h {                                                % procedure for drawing one half
  7 15 moveto 7 25 1 25 1 15 curveto                % ellipse for outer ear
              1  5 7  5 7 15 curveto closepath fill
  1 .5 .5 setrgbcolor                               % dark pink
  6 15 moveto 6 22 2 22 2 15 curveto                % ellipse for inner ear
              2  8 6  8 6 15 curveto closepath fill
  1 setgray                                         % white
  4 3 2 0 360 arc closepath fill                    % circle for outer eye
  0 setgray                                         % black
  4 3 1 0 360 arc closepath fill                    % circle for inner eye
  0 -3 moveto 0 -5 lineto stroke                    % line for upper mouth
  1 -5 1 180 0 arc stroke                           % arc for lower mouth
} def
gsave h grestore                                    % right half
-1 1 scale h                                        % left half
showpage

परिणाम:

करगोश


3

एसवीजी (एचटीएमएल 5), 415 बाइट्स

<svg width=48 height=80><g fill=#fdd><circle cx=24 cy=52 r=24 /><ellipse cx=12 cy=16 rx=8 ry=16 /><ellipse cx=36 cy=16 rx=8 ry=16 /></g><g fill=#f99><ellipse cx=12 cy=16 rx=4 ry=12 /><ellipse cx=36 cy=16 rx=4 ry=12 /></g><g fill=#fff><circle cx=16 cy=44 r=6 /><circle cx=32 cy=44 r=6 /></g><circle cx=16 cy=44 r=3 /><circle cx=32 cy=44 r=3 /><path stroke=#000 fill=none d=M18,60a3,3,180,0,0,6,0v-6v6a3,3,180,0,0,6,0

कीमती बाइट को बचाने में मदद करने के लिए ऊँचाई को 100 से नीचे रखना, लेकिन फिर भी सबसे लंबा ...


3

जावा, 508 472 बाइट्स

import java.awt.*;v->new Frame(){Graphics2D G;Color C;void d(int...d){G.fillOval(d[0],d[1],d[2],d[3]);}{add(new Panel(){public void paint(Graphics g){G=(Graphics2D)g;G.setPaint(C.PINK);d(0,65,99,99);d(22,0,24,75);d(58,0,24,75);G.setPaint(C.MAGENTA);d(27,5,14,65);d(63,5,14,65);G.setPaint(C.WHITE);d(24,85,20,20);d(60,85,20,20);G.setPaint(C.BLACK);d(30,91,8,8);d(66,91,8,8);G.drawArc(41,124,9,11,0,-180);G.drawArc(50,124,9,11,0,-180);G.drawLine(50,119,50,130);}});show();}}

यह परिणामी बनी है:
यहाँ छवि विवरण दर्ज करें

स्पष्टीकरण:

import java.awt.*;              // Required imports for almost everything
v->                             // Method with empty unused parameter and no return-type
  new Frame(){                  //  Create a new Frame
    Graphics2D G;               //   Graphics2D-object on class-level
    Color C;                    //   Color variable to save bytes with static calls
    void d(int...d){            //   Create an inner method with integer-varargs as parameter
      G.fillOval(               //    Draw a circle/oval, filled with the current color:
        d[0],d[1],              //     With the first two integers as starting x,y position
        d[2],                   //     Third as width
        d[3]));}                //     And fourth as height
    {                           //   Then open an initializer-block inside the Frame-class
     add(new Panel(){           //    And add a Panel to the Frame we can draw on
       public void paint(Graphics g){
                                //     Override the Panel's paint-method
         G=(Graphics2D)g;       //      Set the Graphics2D-object with the parameter
         G.setPaint(C.PINK);    //      Set the color to pink (255,175,175)
         d(0,65,99,99);         //      Draw the head circle
         d(22,0,24,75);         //      Draw the left ear
         d(58,0,24,75);         //      Draw the right ear
         G.setPaint(C.MAGENTA); //      Change the color to magenta (255,0,255)
         d(27,5,14,65);         //      Draw the inner part of the left ear
         d(63,5,14,65);         //      Draw the inner part of the right ear
         G.setPaint(C.WHITE);   //      Change the color to white (255,255,255)
         d(24,85,20,20);        //      Draw the left eye
         d(60,85,20,20);        //      Draw the right eye
         G.setPaint(C.BLACK);   //      Change the color to black (0,0,0)
         d(30,91,8,8);          //      Draw the left pupil
         d(66,91,8,8);          //      Draw the right pupil
         G.drawArc(41,124,9,11,0,-180);
                                //      Draw the left mouth elipse
         G.drawArc(50,124,9,11,0,-180);
                                //      Draw the right mouth elipse
         G.drawLine(50,119,50,130);}});
                                //      Draw the line of the mouth
    show();}}                   //    And finally show the Frame on the screen

3

HTML , 280 278 बाइट्स

a{color:#FFC8C8;}b{color:#FF7F7F;font-size:6px;margin-left:-10px;}m,n,j,d{display:block;}m{margin:-15px -3px;font-size:40px;}n{margin:-35px 5px;color:#FFF;font-size:15px;}j{margin:-14px 1px;color:#000;font-size:10px;}
<a><b></b><a><b></b><m><n>● ●<j>●‌‌ ‌‌ ‌‌ ●<d>‌‌ ‌‌ ‌‌ w

यहाँ एक स्क्रीनशॉट है:

यहाँ छवि विवरण दर्ज करें

उद्धरण


0

HTML + सीएसएस

यहाँ छवि विवरण दर्ज करें


.bunny {
  width: 107px;
  position: relative;
  z-index: 1;
  margin-top: 26px;
  margin-left: 37px;
}
.bunny .ears {
  display: flex;
  width: 100%;
  justify-content: center;
}
.bunny .ears .ear {
  width: 16px;
  height: 49px;
  background: #ff7f7e;
  border-radius: 100%;
  border: 7px solid #ffc8c8;
}
.bunny .ears .ear.left {
  margin-right: 8px;
}
.bunny .ears .ear.right {
  margin-left: 8px;
}
.bunny .face {
  width: 107px;
  background: #ffc8c8;
  border-radius: 100%;
  height: 107px;
  margin-top: -8px;
}
.bunny .face .eyes {
  justify-content: center;
  display: flex;
}
.bunny .face .eyes .eye {
  width: 9px;
  height: 9px;
  background: #000;
  border-radius: 100%;
  margin-top: 28px;
  border: 4px solid #fff;
}
.bunny .face .eyes .eye.left {
  margin-right: 12px;
}
.bunny .face .eyes .eye.right {
  margin-left: 12px;
}
.bunny .face .mouth-thing {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-top: 18px;
  margin-right: 2px;
}
.bunny .face .mouth-thing .v-rule {
  height: 12px;
  width: 2px;
  background: #000;
}
.bunny .face .mouth-thing .jowls {
  display: flex;
  justify-content: center;
  overflow: hidden;
}
.bunny .face .mouth-thing .jowls .jowl {
  margin-top: -5px;
  border-radius: 100%;
  border: 2px solid #000;
  height: 9px;
  width: 9px;
}
  <div class="ears">
    <div class="ear left"></div>
    <div class="ear right"></div>
  </div>
  <div class="face">
    <div class="eyes">
      <div class="eye left"></div>
      <div class="eye right"></div>
    </div>
    <div class="mouth-thing">
      <div class="v-rule"></div>
      <div class="jowls">
        <div class="jowl"></div>
        <div class="jowl"></div>
      </div>
    </div>
  </div>
</div>

2
PPCG में आपका स्वागत है! चूँकि यह कोड-गोल्फ टैग किया गया है, जिसका अर्थ है कि ऐबिशन को अपनी बाइट काउंट को कम करने का लक्ष्य रखना चाहिए, हमें अपने बाइट काउंट को कम करने के लिए कोड-गोल्फ सबमिशन की आवश्यकता होती है, जैसे व्हॉट्सएप को कम करना, वैरिएबल के नाम को छोटा करना, आदि। आशा है कि आप आनंद लेंगे आपका ठहरने का स्थल!
इग्नोरेंस

1
आपको अपने बाइटकाउंट को हेडर में शामिल करना चाहिए
Jo King
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.